
/* ========================================================
   DESIGN V2 - LABORATORIO LUIZ GUSTAVO
   SOMENTE CAMADA VISUAL
   ======================================================== */

:root {
    --v2-green: #08a94f;
    --v2-green-dark: #08763e;
    --v2-green-soft: #eafaf1;

    --v2-navy: #071c45;
    --v2-text: #142440;
    --v2-muted: #60708d;

    --v2-line: #e7edf4;
    --v2-bg: #f7f9fc;
    --v2-white: #ffffff;

    --v2-radius: 22px;
    --v2-radius-small: 15px;

    --v2-shadow:
        0 14px 40px rgba(19, 44, 77, .10);

    --v2-shadow-soft:
        0 8px 24px rgba(19, 44, 77, .08);
}

/* --------------------------------------------------------
   BASE
   -------------------------------------------------------- */

html {
    scroll-behavior: smooth;
}

body {
    background:
        linear-gradient(
            180deg,
            #ffffff 0,
            #f8fbfd 35%,
            #ffffff 100%
        ) !important;

    color: var(--v2-text) !important;

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.modal-open {
    overflow: hidden !important;
}

/* --------------------------------------------------------
   CONTEUDO PRINCIPAL
   -------------------------------------------------------- */

main,
.main,
.page,
.page__content,
.container {
    position: relative;
}

.story__article {
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;

    font-size: 17px;
    line-height: 1.68;

    color: var(--v2-text);
}

.story__article h2 {
    color: var(--v2-navy);

    font-size: clamp(21px, 3.6vw, 29px);
    line-height: 1.18;

    letter-spacing: -.025em;

    margin-top: 40px;
    margin-bottom: 14px;

    font-weight: 850;
}

.story__article h2:first-child {
    margin-top: 8px;
}

.story__article p {
    margin: 0 0 14px;
}

.story__article strong {
    color: #101c35;
    font-weight: 800;
}

.story__article ul {
    list-style: none;
    padding: 0;
    margin: 20px 0 30px;

    display: grid;
    gap: 10px;
}

.story__article li {
    position: relative;

    background: #f8fbfd;

    border: 1px solid var(--v2-line);
    border-radius: 14px;

    padding: 13px 15px;

    font-weight: 600;

    box-shadow:
        0 3px 10px rgba(20, 45, 75, .035);
}

/* --------------------------------------------------------
   CARDS / SECOES
   -------------------------------------------------------- */

.card,
.campaign-card,
.progress-card,
.article,
.story,
.donation-card {
    border-color: var(--v2-line) !important;
}

/* --------------------------------------------------------
   BOTOES GERAIS
   -------------------------------------------------------- */

button,
.button,
.btn,
a.button {
    font-family: inherit;
}

.article__donate,
.dock__btn {
    background:
        linear-gradient(
            135deg,
            #04b957,
            #078e45
        ) !important;

    color: #fff !important;

    border: 0 !important;

    box-shadow:
        0 10px 25px rgba(5, 160, 76, .27) !important;

    font-weight: 850 !important;
}

/* --------------------------------------------------------
   DOCK FIXO
   -------------------------------------------------------- */

.dock {
    background:
        linear-gradient(
            90deg,
            #00a84f,
            #058842
        ) !important;

    border-top:
        1px solid rgba(255,255,255,.18) !important;

    box-shadow:
        0 -10px 30px rgba(0, 73, 35, .15) !important;

    backdrop-filter: blur(10px);
}

.dock__btn {
    min-height: 62px;

    border-radius: 16px !important;

    font-size: clamp(17px, 4vw, 22px) !important;

    letter-spacing: -.02em;

    transition:
        transform .15s ease,
        filter .15s ease;
}

.dock__btn:active {
    transform: scale(.98);
}

/* --------------------------------------------------------
   OVERLAY
   -------------------------------------------------------- */

.modal-overlay {
    background:
        rgba(14, 26, 41, .66) !important;

    backdrop-filter:
        blur(7px);

    -webkit-backdrop-filter:
        blur(7px);
}

/* --------------------------------------------------------
   MODAIS
   -------------------------------------------------------- */

.modal {
    padding:
        max(18px, env(safe-area-inset-top))
        18px
        max(18px, env(safe-area-inset-bottom));

    box-sizing: border-box;
}

.modal__panel {
    border-radius: 24px !important;

    border:
        1px solid rgba(220,229,239,.95) !important;

    background:
        rgba(255,255,255,.985) !important;

    box-shadow:
        0 25px 70px rgba(6, 25, 54, .22) !important;
}

.modal__panel--donate {
    width:
        min(900px, calc(100vw - 32px)) !important;

    max-height:
        calc(100vh - 34px) !important;

    overflow-y: auto;

    padding:
        32px 30px 28px !important;
}

/* --------------------------------------------------------
   CABECALHO DO MODAL
   -------------------------------------------------------- */

.modal__head {
    text-align: left !important;

    padding-right: 56px;
}

.modal__title {
    color: var(--v2-navy) !important;

    font-size:
        clamp(27px, 5vw, 44px) !important;

    line-height: 1.04 !important;

    letter-spacing: -.04em;

    font-weight: 900 !important;

    margin-bottom: 10px !important;
}

.modal__lead {
    color: var(--v2-muted) !important;

    font-size:
        clamp(15px, 2.4vw, 18px) !important;

    line-height: 1.45 !important;

    max-width: 620px;
}

/* --------------------------------------------------------
   X
   -------------------------------------------------------- */

.modal__close {
    width: 44px !important;
    height: 44px !important;

    display: grid !important;
    place-items: center !important;

    border-radius: 50% !important;

    background: #fff !important;

    border:
        1px solid #edf1f5 !important;

    color: #142034 !important;

    font-size: 30px !important;
    font-weight: 300 !important;

    box-shadow:
        0 6px 20px rgba(20, 38, 65, .10) !important;

    transition:
        transform .15s ease,
        background .15s ease;
}

.modal__close:hover {
    background:
        #f8fafc !important;
}

.modal__close:active {
    transform: scale(.94);
}

/* --------------------------------------------------------
   GRID DOS VALORES
   -------------------------------------------------------- */

.pick-grid {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 14px !important;

    padding: 0 !important;

    margin:
        28px 0 20px !important;

    list-style: none !important;
}

.pick-grid__item {
    min-width: 0;
}

.pick-btn--grid,
.pick-grid button,
.pick-grid a {
    width: 100% !important;

    min-height: 108px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;

    border-radius: 18px !important;

    border:
        1px solid #e2e9f0 !important;

    background:
        linear-gradient(
            180deg,
            #ffffff,
            #fbfcfd
        ) !important;

    color:
        #076f3c !important;

    font-size:
        clamp(22px, 3vw, 31px) !important;

    font-weight:
        900 !important;

    letter-spacing:
        -.025em;

    box-shadow:
        0 7px 18px rgba(15, 39, 68, .055) !important;

    transition:
        transform .15s ease,
        border-color .15s ease,
        box-shadow .15s ease;
}

.pick-btn--grid:hover,
.pick-grid button:hover,
.pick-grid a:hover {
    transform:
        translateY(-2px);

    border-color:
        #9adfb7 !important;

    box-shadow:
        0 10px 24px rgba(8, 105, 56, .12) !important;
}

.pick-btn--grid:active,
.pick-grid button:active,
.pick-grid a:active {
    transform:
        scale(.985);
}

/* Primeiro valor mais destacado */

.pick-grid__item:first-child
.pick-btn--grid,
.pick-grid__item:first-child button,
.pick-grid__item:first-child a {
    background:
        linear-gradient(
            135deg,
            #08be59,
            #029547
        ) !important;

    color:
        #ffffff !important;

    border-color:
        transparent !important;

    box-shadow:
        0 12px 28px rgba(4, 166, 78, .26) !important;
}

/* --------------------------------------------------------
   RODAPE DO MODAL
   -------------------------------------------------------- */

.modal__foot {
    color:
        #6d7990 !important;

    font-size:
        13px !important;

    text-align:
        center !important;

    margin-top:
        18px !important;
}

/* --------------------------------------------------------
   PIX MODAL
   -------------------------------------------------------- */

.modal__panel--pay {
    border-radius:
        24px !important;

    overflow:
        hidden;
}

.pay-qr__image,
#pix-qr-image {
    border-radius:
        16px;

    border:
        1px solid #e8edf2;

    background:
        #fff;
}

#pix-copy {
    border-radius:
        14px !important;

    min-height:
        50px;

    background:
        #079849 !important;

    color:
        #ffffff !important;

    border:
        0 !important;

    font-weight:
        800 !important;
}

/* --------------------------------------------------------
   EXIT MODAL
   -------------------------------------------------------- */

#exit-donation-modal
.exit-donation__panel {
    border-radius:
        24px !important;

    max-width:
        430px !important;

    box-shadow:
        0 30px 75px rgba(5, 24, 49, .30) !important;
}

.exit-donation__heart {
    font-size:
        40px !important;
}

#exit-donation-title {
    color:
        var(--v2-navy) !important;

    font-weight:
        900 !important;
}

.exit-donation__value {
    border-radius:
        16px !important;

    border:
        1px solid #b6e8ca !important;

    background:
        linear-gradient(
            180deg,
            #effcf4,
            #e7f9ef
        ) !important;

    box-shadow:
        0 6px 16px rgba(5, 130, 62, .07);

    min-height:
        88px !important;
}

.exit-donation__value strong {
    color:
        #058440 !important;

    font-size:
        22px !important;
}

/* --------------------------------------------------------
   SCROLLBAR DO MODAL
   -------------------------------------------------------- */

.modal__panel::-webkit-scrollbar {
    width: 7px;
}

.modal__panel::-webkit-scrollbar-track {
    background: transparent;
}

.modal__panel::-webkit-scrollbar-thumb {
    background:
        #dce5ed;

    border-radius:
        999px;
}

/* --------------------------------------------------------
   MOBILE
   -------------------------------------------------------- */

@media (max-width: 700px) {

    .story__article {
        font-size:
            16px;

        line-height:
            1.62;
    }

    .story__article h2 {
        font-size:
            22px;

        margin-top:
            31px;
    }

    .modal {
        padding:
            12px !important;
    }

    .modal__panel--donate {
        width:
            calc(100vw - 24px) !important;

        max-height:
            calc(100dvh - 24px) !important;

        border-radius:
            20px !important;

        padding:
            25px 16px 20px !important;
    }

    .modal__head {
        padding-right:
            45px;
    }

    .modal__title {
        font-size:
            28px !important;

        line-height:
            1.05 !important;
    }

    .modal__lead {
        font-size:
            14px !important;
    }

    .modal__close {
        width:
            38px !important;

        height:
            38px !important;

        font-size:
            25px !important;
    }

    .pick-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap:
            10px !important;

        margin-top:
            20px !important;
    }

    .pick-btn--grid,
    .pick-grid button,
    .pick-grid a {
        min-height:
            78px !important;

        border-radius:
            14px !important;

        font-size:
            20px !important;
    }

    .dock {
        padding-bottom:
            env(safe-area-inset-bottom) !important;
    }

    .dock__btn {
        min-height:
            58px;
    }
}

/* --------------------------------------------------------
   TELAS MUITO PEQUENAS
   -------------------------------------------------------- */

@media (max-width: 380px) {

    .pick-btn--grid,
    .pick-grid button,
    .pick-grid a {
        font-size:
            18px !important;

        min-height:
            70px !important;
    }

    .modal__panel--donate {
        padding-left:
            12px !important;

        padding-right:
            12px !important;
    }
}

/* =========================================================
   DESIGN V3 - HERO / PROGRESSO / HISTORIA
   LABORATORIO /luizgustavo/
   SOMENTE VISUAL
   ========================================================= */

:root {
    --apc-navy: #071d46;
    --apc-blue: #15365f;
    --apc-green: #00a94f;
    --apc-green-dark: #007d3b;
    --apc-green-soft: #eafaf1;
    --apc-orange: #f47a20;
    --apc-muted: #5d708e;
    --apc-border: #e4eaf1;
    --apc-bg: #f7fafc;
}

/* ===== PÁGINA ===== */

body {
    background: #fff !important;
}

.page {
    width: min(1180px, calc(100% - 40px)) !important;
    max-width: 1180px !important;
    margin: 0 auto !important;
    padding-top: 0 !important;
}

/* ===== HEADER ===== */

.hotbar {
    background: rgba(255,255,255,.97) !important;
    border-bottom: 1px solid #edf1f5 !important;
    box-shadow: 0 2px 14px rgba(9,35,68,.035) !important;
}

.hotbar__inner {
    width: min(1180px, calc(100% - 40px)) !important;
    max-width: 1180px !important;
    min-height: 76px !important;
    margin: 0 auto !important;
}

.hotbar__logo {
    width: 42px !important;
    height: 42px !important;
    object-fit: contain !important;
}

.hotbar__name {
    font-size: 17px !important;
    font-weight: 800 !important;
    letter-spacing: -.02em !important;
}

.hotbar__name-prefix {
    color: var(--apc-navy) !important;
}

.hotbar__name-accent {
    color: var(--apc-orange) !important;
}

.hotbar__menu {
    width: 46px !important;
    height: 46px !important;
    border-radius: 13px !important;
    background: #fff !important;
    border: 1px solid #e4eaf0 !important;
    box-shadow: 0 4px 14px rgba(14,38,67,.06) !important;
}

/* =========================================================
   HERO
   Reorganiza os elementos existentes sem alterar HTML
   ========================================================= */

.intro {
    display: grid !important;
    grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr) !important;
    grid-template-rows: auto auto 1fr !important;
    column-gap: 54px !important;

    align-items: center !important;

    position: relative !important;

    margin: 0 !important;
    padding: 48px 0 38px !important;

    min-height: 535px !important;

    text-align: left !important;
}

.intro::before {
    content: "" !important;

    position: absolute !important;
    z-index: -1 !important;

    top: 18px !important;
    right: -100vw !important;
    bottom: 18px !important;
    left: 53% !important;

    background:
        radial-gradient(
            circle at 30% 40%,
            rgba(226,248,235,.88),
            rgba(246,251,248,.45) 52%,
            rgba(255,255,255,0) 75%
        ) !important;
}

.intro__tag {
    grid-column: 1 !important;
    grid-row: 1 !important;

    justify-self: start !important;

    display: inline-flex !important;
    align-items: center !important;

    width: auto !important;

    margin: 0 0 18px !important;
    padding: 8px 14px !important;

    border: 1px solid #a9e7c3 !important;
    border-radius: 999px !important;

    background: #ebfbf2 !important;

    color: #00853f !important;

    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 900 !important;

    text-transform: uppercase !important;
    letter-spacing: .035em !important;
}

.intro__tag::before {
    content: "♥" !important;
    margin-right: 7px !important;
    font-size: 12px !important;
}

.intro__title {
    grid-column: 1 !important;
    grid-row: 2 !important;

    align-self: start !important;

    max-width: 590px !important;

    margin: 0 !important;

    color: var(--apc-navy) !important;

    font-size: clamp(39px, 4.2vw, 61px) !important;
    line-height: .99 !important;
    font-weight: 950 !important;

    letter-spacing: -.052em !important;

    text-align: left !important;
}

.intro__subtitle {
    grid-column: 1 !important;
    grid-row: 3 !important;

    align-self: start !important;

    max-width: 545px !important;

    margin: 22px 0 0 !important;

    color: #435a7a !important;

    font-size: 20px !important;
    line-height: 1.46 !important;
    font-weight: 500 !important;

    text-align: left !important;
}

.intro__photo-card {
    grid-column: 2 !important;
    grid-row: 1 / 4 !important;

    align-self: stretch !important;

    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    overflow: visible !important;
}

.intro__photo {
    width: 100% !important;
    height: 100% !important;
    min-height: 480px !important;

    margin: 0 !important;

    position: relative !important;

    overflow: hidden !important;

    border-radius: 30px !important;

    background: #e8f0f4 !important;

    box-shadow:
        0 22px 55px rgba(11,39,71,.14) !important;
}

.intro__photo::after {
    content: none !important;

    

    position: absolute !important;

    right: 24px !important;
    bottom: 24px !important;

    max-width: 185px !important;

    padding: 12px 17px !important;

    border-radius: 16px !important;

    background: rgba(255,255,255,.90) !important;

    color: #087443 !important;

    font-size: 17px !important;
    line-height: 1.2 !important;
    font-weight: 850 !important;

    text-align: center !important;

    box-shadow:
        0 9px 26px rgba(9,37,66,.12) !important;

    backdrop-filter: blur(9px) !important;
}

.intro__photo picture {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

.intro__img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;
    min-height: 480px !important;

    object-fit: cover !important;
    object-position: center !important;

    border-radius: 30px !important;
}

/* =========================================================
   ARRECADAÇÃO
   ========================================================= */

.progress-card {
    position: relative !important;

    display: grid !important;
    grid-template-columns: 1fr auto !important;
    grid-template-areas:
        "label pct"
        "amounts pct"
        "track track" !important;

    align-items: center !important;

    margin: 0 0 28px !important;
    padding: 25px 30px 27px !important;

    border: 1px solid #e2e9f0 !important;
    border-radius: 22px !important;

    background: #fff !important;

    box-shadow:
        0 12px 32px rgba(13,42,74,.09) !important;
}

.progress-card__head {
    display: contents !important;
}

.progress-card__label {
    grid-area: label !important;

    color: #7c8ba1 !important;

    font-size: 12px !important;
    font-weight: 850 !important;

    text-transform: uppercase !important;
    letter-spacing: .055em !important;
}

.progress-card__pct {
    grid-area: pct !important;

    align-self: center !important;

    margin-left: 32px !important;

    color: var(--apc-green) !important;

    font-size: 27px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
}

.progress-card__amounts {
    grid-area: amounts !important;

    display: flex !important;
    align-items: baseline !important;
    flex-wrap: wrap !important;

    gap: 8px !important;

    margin: 5px 0 19px !important;
}

.progress-card__raised {
    color: var(--apc-green) !important;

    font-size: clamp(31px, 4vw, 45px) !important;
    line-height: 1 !important;
    font-weight: 950 !important;

    letter-spacing: -.035em !important;
}

.progress-card__goal {
    color: #8490a2 !important;

    font-size: 14px !important;
    font-weight: 650 !important;
}

.progress-card__track {
    grid-area: track !important;

    height: 12px !important;

    overflow: hidden !important;

    border-radius: 999px !important;

    background: #e9eef4 !important;
}

.progress-card__fill {
    height: 100% !important;

    border-radius: inherit !important;

    background:
        linear-gradient(
            90deg,
            #05c45d,
            #009b49
        ) !important;

    box-shadow:
        0 0 16px rgba(0,174,81,.20) !important;
}

/* =========================================================
   HISTÓRIA
   ========================================================= */

.article {
    margin: 0 0 30px !important;
    padding: 34px 38px 38px !important;

    border: 1px solid #e7edf3 !important;
    border-radius: 24px !important;

    background: #fff !important;

    box-shadow:
        0 10px 30px rgba(14,42,73,.055) !important;
}

.article__head {
    margin-bottom: 25px !important;
    padding-bottom: 18px !important;

    border-bottom: 1px solid #edf1f4 !important;
}

.article__head h2 {
    margin: 0 !important;

    color: var(--apc-navy) !important;

    font-size: 31px !important;
    line-height: 1.1 !important;
    font-weight: 950 !important;

    letter-spacing: -.035em !important;
}

.article__meta {
    margin-top: 8px !important;

    color: #8491a5 !important;

    font-size: 13px !important;
}

.story__article {
    max-width: none !important;

    color: #263a57 !important;

    font-size: 17px !important;
    line-height: 1.66 !important;
}

.story__article h2 {
    position: relative !important;

    margin: 32px 0 11px !important;

    color: var(--apc-navy) !important;

    font-size: 23px !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;

    letter-spacing: -.025em !important;
}

.story__article h2:first-child {
    margin-top: 0 !important;
}

.story__article p {
    margin: 0 0 13px !important;
}

.story__article ul {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 10px !important;

    margin: 17px 0 24px !important;
}

.story__article li {
    margin: 0 !important;
    padding: 14px 15px !important;

    border: 1px solid #dceee4 !important;
    border-radius: 14px !important;

    background:
        linear-gradient(
            135deg,
            #f4fcf7,
            #fbfefd
        ) !important;

    color: #234632 !important;

    font-size: 14px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
}

.article__donate {
    width: 100% !important;

    min-height: 60px !important;

    margin-top: 27px !important;

    border-radius: 16px !important;

    font-size: 18px !important;
    font-weight: 900 !important;
}

/*
 * Este bloco possui nomes/valores/depoimentos estáticos no HTML.
 * Ocultamos visualmente no laboratório para não apresentar
 * atividade de doação não confirmada como real.
 */
.social-feed {
    display: none !important;
}

/* =========================================================
   CTA FIXO
   ========================================================= */

.dock {
    background:
        linear-gradient(
            90deg,
            #009f4a,
            #00ad51
        ) !important;

    border: 0 !important;

    box-shadow:
        0 -10px 30px rgba(0,74,36,.18) !important;
}

.dock__btn {
    max-width: 1180px !important;

    margin: 0 auto !important;

    min-height: 68px !important;

    background: transparent !important;

    box-shadow: none !important;

    border-radius: 0 !important;

    font-size: 21px !important;
    font-weight: 900 !important;
}

.dock__icon {
    font-size: 25px !important;
}

/* =========================================================
   MOBILE - REFERÊNCIA VISUAL
   ========================================================= */

@media (max-width: 760px) {

    .page {
        width: 100% !important;
        padding: 0 16px 92px !important;
    }

    .hotbar__inner {
        width: 100% !important;
        min-height: 64px !important;
        padding: 0 16px !important;
    }

    .hotbar__logo {
        width: 34px !important;
        height: 34px !important;
    }

    .hotbar__name {
        font-size: 14px !important;
    }

    .hotbar__menu {
        width: 40px !important;
        height: 40px !important;
        border-radius: 11px !important;
    }

    /* HERO MOBILE */

    .intro {
        display: flex !important;
        flex-direction: column !important;

        min-height: 0 !important;

        padding: 20px 0 15px !important;

        text-align: left !important;
    }

    .intro::before {
        display: none !important;
    }

    .intro__tag {
        order: 1 !important;

        margin: 0 0 13px !important;
        padding: 7px 12px !important;

        font-size: 11px !important;
    }

    .intro__title {
        order: 2 !important;

        max-width: 100% !important;

        margin: 0 !important;

        font-size: clamp(31px, 9.4vw, 42px) !important;
        line-height: 1.01 !important;

        text-align: left !important;
    }

    .intro__subtitle {
        order: 3 !important;

        max-width: 100% !important;

        margin: 15px 0 19px !important;

        font-size: 16px !important;
        line-height: 1.46 !important;

        text-align: left !important;
    }

    .intro__photo-card {
        order: 4 !important;

        width: 100% !important;
        height: auto !important;

        margin: 0 !important;
    }

    .intro__photo {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;

        aspect-ratio: 4 / 3 !important;

        border-radius: 20px !important;

        box-shadow:
            0 10px 26px rgba(10,38,70,.11) !important;
    }

    .intro__img {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;

        object-fit: cover !important;
        object-position: center 30% !important;

        border-radius: 20px !important;
    }

    .intro__photo::after {
        right: 12px !important;
        bottom: 12px !important;

        max-width: 150px !important;

        padding: 9px 12px !important;

        border-radius: 12px !important;

        font-size: 13px !important;
    }

    /* PROGRESSO MOBILE */

    .progress-card {
        margin: 0 0 18px !important;
        padding: 19px 18px 21px !important;

        border-radius: 18px !important;
    }

    .progress-card__label {
        font-size: 10px !important;
    }

    .progress-card__pct {
        margin-left: 15px !important;

        font-size: 18px !important;
    }

    .progress-card__amounts {
        margin: 5px 0 15px !important;
    }

    .progress-card__raised {
        font-size: 29px !important;
    }

    .progress-card__goal {
        font-size: 12px !important;
    }

    .progress-card__track {
        height: 9px !important;
    }

    /* HISTÓRIA MOBILE */

    .article {
        margin-bottom: 16px !important;
        padding: 22px 18px 25px !important;

        border-radius: 18px !important;
    }

    .article__head {
        margin-bottom: 20px !important;
        padding-bottom: 14px !important;
    }

    .article__head h2 {
        font-size: 25px !important;
    }

    .story__article {
        font-size: 15.5px !important;
        line-height: 1.58 !important;
    }

    .story__article h2 {
        margin: 25px 0 9px !important;

        font-size: 20px !important;
        line-height: 1.2 !important;
    }

    .story__article p {
        margin-bottom: 10px !important;
    }

    .story__article ul {
        grid-template-columns: 1fr !important;

        gap: 8px !important;

        margin: 14px 0 20px !important;
    }

    .story__article li {
        padding: 12px 13px !important;

        font-size: 13.5px !important;
    }

    .article__donate {
        min-height: 56px !important;

        margin-top: 22px !important;

        font-size: 16px !important;
    }

    /* CTA MOBILE */

    .dock {
        padding:
            9px 10px
            calc(9px + env(safe-area-inset-bottom))
            !important;
    }

    .dock__btn {
        min-height: 56px !important;

        border-radius: 15px !important;

        background:
            rgba(0,181,84,.92) !important;

        font-size: 17px !important;
    }
}

/* celulares estreitos */

@media (max-width: 390px) {

    .page {
        padding-left: 13px !important;
        padding-right: 13px !important;
    }

    .intro__title {
        font-size: 29px !important;
    }

    .intro__subtitle {
        font-size: 15px !important;
    }

    .hotbar__name {
        font-size: 13px !important;
    }
}



/* =========================================================
   DONATION MODAL V4
   Inspirado no layout de referencia
   SOMENTE /luizgustavo/
   ========================================================= */

#donation-modal.donation-v4 {
    padding: 22px !important;
}

#donation-modal .donation-v4__panel {
    position: relative !important;

    width: min(900px, calc(100vw - 44px)) !important;
    max-height: calc(100dvh - 44px) !important;

    padding: 30px 32px 24px !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    border: 1px solid rgba(225,232,240,.96) !important;
    border-radius: 31px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #ffffff 68%,
            #f9fcfa 100%
        ) !important;

    box-shadow:
        0 32px 90px rgba(2,23,48,.28) !important;
}

#donation-modal .donation-v4__close {
    top: 25px !important;
    right: 25px !important;

    width: 48px !important;
    height: 48px !important;

    z-index: 10 !important;

    border-radius: 50% !important;

    background: #fff !important;
    color: #142033 !important;

    border: 1px solid #e9eef3 !important;

    font-size: 30px !important;

    box-shadow:
        0 7px 23px rgba(14,36,62,.10) !important;
}

/* BADGE */

.donation-v4__badge {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 8px !important;

    width: max-content !important;
    max-width: calc(100% - 110px) !important;

    margin: 0 auto 24px !important;

    padding: 10px 18px !important;

    border-radius: 999px !important;

    border: 1px solid #bdebd0 !important;

    background:
        linear-gradient(
            90deg,
            #edfdf4,
            #e3f9ed
        ) !important;

    color: #087a40 !important;

    font-size: 14px !important;
    line-height: 1 !important;
    font-weight: 900 !important;

    letter-spacing: .015em !important;
}

.donation-v4__badge span {
    color: #08ae54 !important;
    font-size: 22px !important;
}

/* HERO DO MODAL */

.donation-v4__hero {
    display: grid !important;
    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(220px, .75fr)
        !important;

    align-items: center !important;

    gap: 25px !important;

    margin-bottom: 25px !important;
}

.donation-v4__copy {
    min-width: 0 !important;
}

#donation-modal .donation-v4__title {
    margin: 0 !important;

    color: #071d46 !important;

    font-size: clamp(41px, 5vw, 61px) !important;
    line-height: .98 !important;
    font-weight: 950 !important;

    text-align: left !important;

    letter-spacing: -.055em !important;
}

#donation-modal .donation-v4__lead {
    max-width: 530px !important;

    margin: 20px 0 0 !important;

    color: #536b8f !important;

    font-size: 19px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;

    text-align: left !important;
}

/* ARTE DECORATIVA */

.donation-v4__art {
    position: relative !important;

    min-height: 205px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    transform: rotate(-2deg);
}

.donation-v4__brush {
    position: absolute !important;

    width: 235px !important;
    height: 115px !important;

    top: 66px !important;
    left: 50% !important;

    transform:
        translateX(-50%)
        rotate(-7deg)
        !important;

    border-radius:
        55% 45% 50% 42% /
        45% 60% 40% 55% !important;

    background:
        linear-gradient(
            100deg,
            rgba(214,249,228,.58),
            rgba(226,250,234,.92),
            rgba(233,250,239,.44)
        ) !important;
}

.donation-v4__heart {
    position: absolute !important;

    top: 4px !important;
    left: 50% !important;

    transform:
        translateX(-50%)
        rotate(-7deg)
        !important;

    color: #05aa50 !important;

    font-size: 105px !important;
    line-height: 1 !important;

    text-shadow:
        -10px 7px 0 rgba(37,199,108,.22) !important;

    z-index: 2 !important;
}

.donation-v4__handwriting {
    position: relative !important;
    z-index: 3 !important;

    margin-top: 72px !important;

    color: #08733f !important;

    font-family:
        "Comic Sans MS",
        "Segoe Print",
        cursive !important;

    font-size: 31px !important;
    line-height: .92 !important;

    font-weight: 600 !important;

    text-align: center !important;

    transform: rotate(-8deg) !important;
}

.donation-v4__handwriting span {
    display: inline-block !important;

    margin-left: 7px !important;

    font-size: 39px !important;
}

/* GRID */

#donation-modal .donation-v4__grid {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 15px !important;

    margin: 10px 0 28px !important;
    padding: 0 !important;
}

#donation-modal .donation-v4__grid .pick-grid__item {
    margin: 0 !important;
    padding: 0 !important;

    min-width: 0 !important;

    list-style: none !important;
}

#donation-modal .donation-v4__amount {
    position: relative !important;

    width: 100% !important;
    height: 124px !important;
    min-height: 124px !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 9px !important;

    padding: 15px !important;

    border: 1px solid #e0e7ee !important;
    border-radius: 19px !important;

    background:
        linear-gradient(
            155deg,
            #fff 0%,
            #fefefe 58%,
            #fafcfd 100%
        ) !important;

    color: #08763e !important;

    box-shadow:
        0 7px 21px rgba(14,39,69,.055) !important;

    cursor: pointer !important;

    transition:
        transform .16s ease,
        border-color .16s ease,
        box-shadow .16s ease
        !important;
}

#donation-modal .donation-v4__amount:hover {
    transform: translateY(-3px) !important;

    border-color: #9ddfba !important;

    box-shadow:
        0 12px 28px rgba(5,123,59,.12) !important;
}

#donation-modal .donation-v4__amount:active {
    transform: scale(.98) !important;
}

.donation-v4__price {
    display: block !important;

    color: #08763e !important;

    font-size: 30px !important;
    line-height: 1 !important;
    font-weight: 950 !important;

    letter-spacing: -.035em !important;
}

.donation-v4__desc {
    display: block !important;

    max-width: 180px !important;

    color: #536b91 !important;

    font-size: 16px !important;
    line-height: 1.25 !important;
    font-weight: 500 !important;

    text-align: center !important;
}

/* R$30 */

#donation-modal .donation-v4__amount--featured {
    background:
        linear-gradient(
            135deg,
            #06c35c,
            #00a94f
        ) !important;

    border-color: transparent !important;

    box-shadow:
        0 15px 34px rgba(3,172,80,.26) !important;
}

#donation-modal .donation-v4__amount--featured
.donation-v4__price,
#donation-modal .donation-v4__amount--featured
.donation-v4__desc {
    color: #fff !important;
}

.donation-v4__miniheart {
    position: absolute !important;

    top: 28px !important;
    right: 25px !important;

    color: #fff !important;

    font-size: 25px !important;
}

/* 1000 ocupa linha toda */

#donation-modal .donation-v4__item--wide {
    grid-column: 1 / -1 !important;
}

#donation-modal
.donation-v4__item--wide
.donation-v4__amount {
    height: 108px !important;
    min-height: 108px !important;
}

/* TRUST */

.donation-v4__trust {
    display: grid !important;

    grid-template-columns:
        1fr auto 1fr auto 1fr !important;

    align-items: center !important;

    margin: 8px 5px 25px !important;
}

.donation-v4__trust-item {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 12px !important;

    color: #50688c !important;

    font-size: 14px !important;
    line-height: 1.25 !important;
    font-weight: 550 !important;
}

.donation-v4__trust-icon {
    width: 44px !important;
    height: 44px !important;

    flex: 0 0 44px !important;

    display: grid !important;
    place-items: center !important;

    color: #009f4a !important;

    border: 2px solid #08ad54 !important;
    border-radius: 13px !important;

    font-size: 24px !important;
    line-height: 1 !important;

    font-weight: 900 !important;
}

.donation-v4__trust-separator {
    width: 1px !important;
    height: 48px !important;

    margin: 0 17px !important;

    background: #e3e9ee !important;
}

/* THANK YOU */

.donation-v4__thanks {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 25px !important;

    padding: 21px 25px !important;

    border: 1px solid #c9efda !important;
    border-radius: 19px !important;

    background:
        linear-gradient(
            90deg,
            #ebfcf3,
            #e8faef,
            #f1fcf5
        ) !important;
}

.donation-v4__thanks-left {
    display: flex !important;
    align-items: center !important;

    gap: 15px !important;

    color: #08713c !important;

    font-size: 16px !important;
    line-height: 1.3 !important;
}

.donation-v4__thanks-left strong {
    font-weight: 900 !important;
}

.donation-v4__thanks-heart {
    color: #07ae52 !important;

    font-size: 48px !important;

    text-shadow:
        -7px 4px 0 rgba(53,207,122,.19) !important;
}

.donation-v4__thanks-right {
    color: #174e36 !important;

    font-family:
        "Comic Sans MS",
        "Segoe Print",
        cursive !important;

    font-size: 18px !important;
    line-height: 1.15 !important;

    text-align: center !important;

    transform: rotate(-3deg) !important;
}

#donation-modal .donation-v4__foot {
    margin: 14px 0 0 !important;

    color: #8792a3 !important;

    font-size: 11px !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    #donation-modal.donation-v4 {
        padding: 9px !important;
    }

    #donation-modal .donation-v4__panel {
        width: calc(100vw - 18px) !important;
        max-height: calc(100dvh - 18px) !important;

        padding: 22px 16px 17px !important;

        border-radius: 22px !important;
    }

    #donation-modal .donation-v4__close {
        top: 15px !important;
        right: 15px !important;

        width: 39px !important;
        height: 39px !important;

        font-size: 25px !important;
    }

    .donation-v4__badge {
        margin-bottom: 17px !important;
        padding: 8px 12px !important;

        font-size: 10.5px !important;
    }

    .donation-v4__badge span {
        font-size: 16px !important;
    }

    .donation-v4__hero {
        display: block !important;

        margin-bottom: 17px !important;
    }

    #donation-modal .donation-v4__title {
        padding-right: 44px !important;

        font-size: 31px !important;
        line-height: 1 !important;

        text-align: left !important;
    }

    #donation-modal .donation-v4__lead {
        margin-top: 12px !important;

        padding-right: 0 !important;

        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    /* arte fica compacta no celular */

    .donation-v4__art {
        display: none !important;
    }

    #donation-modal .donation-v4__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 10px !important;

        margin-bottom: 19px !important;
    }

    #donation-modal .donation-v4__amount {
        height: 87px !important;
        min-height: 87px !important;

        gap: 6px !important;

        padding: 10px 7px !important;

        border-radius: 14px !important;
    }

    .donation-v4__price {
        font-size: 21px !important;
    }

    .donation-v4__desc {
        max-width: 130px !important;

        font-size: 12px !important;
        line-height: 1.15 !important;
    }

    .donation-v4__miniheart {
        top: 18px !important;
        right: 13px !important;

        font-size: 17px !important;
    }

    #donation-modal
    .donation-v4__item--wide
    .donation-v4__amount {
        height: 82px !important;
        min-height: 82px !important;
    }

    /* trust em 3 colunas compactas */

    .donation-v4__trust {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 7px !important;

        margin: 4px 0 17px !important;
    }

    .donation-v4__trust-separator {
        display: none !important;
    }

    .donation-v4__trust-item {
        flex-direction: column !important;

        gap: 5px !important;

        font-size: 9.5px !important;
        line-height: 1.15 !important;

        text-align: center !important;
    }

    .donation-v4__trust-icon {
        width: 31px !important;
        height: 31px !important;

        flex-basis: 31px !important;

        border-radius: 9px !important;

        font-size: 16px !important;
    }

    .donation-v4__thanks {
        padding: 14px !important;

        border-radius: 14px !important;

        gap: 10px !important;
    }

    .donation-v4__thanks-left {
        gap: 8px !important;

        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    .donation-v4__thanks-heart {
        font-size: 31px !important;
    }

    .donation-v4__thanks-right {
        font-size: 11px !important;
    }

    #donation-modal .donation-v4__foot {
        margin-top: 9px !important;
        font-size: 9px !important;
    }
}

@media (max-width: 390px) {

    #donation-modal .donation-v4__panel {
        padding-left: 13px !important;
        padding-right: 13px !important;
    }

    #donation-modal .donation-v4__title {
        font-size: 28px !important;
    }

    #donation-modal .donation-v4__amount {
        height: 80px !important;
        min-height: 80px !important;
    }

    .donation-v4__price {
        font-size: 19px !important;
    }

    .donation-v4__desc {
        font-size: 11px !important;
    }
}



/* =========================================================
   MODAL PREMIUM SAFE
   ========================================================= */

#donation-modal.donation-premium {
    padding: 20px !important;
}

#donation-modal .donation-premium__panel {
    width: min(920px, calc(100vw - 40px)) !important;
    max-height: calc(100dvh - 40px) !important;

    padding: 30px 32px 24px !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    border-radius: 30px !important;
    border: 1px solid #e4eaf0 !important;

    background: #fff !important;

    box-shadow:
        0 30px 90px rgba(5, 27, 54, .28) !important;
}

#donation-modal .donation-premium__close {
    top: 24px !important;
    right: 24px !important;

    width: 46px !important;
    height: 46px !important;

    border-radius: 50% !important;

    background: #fff !important;
    border: 1px solid #e8edf2 !important;

    color: #172235 !important;

    box-shadow:
        0 6px 20px rgba(17, 37, 61, .10) !important;
}

/* badge */

.donation-premium__badge {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 8px !important;

    width: max-content !important;

    margin: 0 auto 25px !important;

    padding: 10px 18px !important;

    border-radius: 999px !important;

    border: 1px solid #b9e9cc !important;

    background: #eafaf1 !important;

    color: #087b41 !important;

    font-size: 14px !important;
    font-weight: 900 !important;
}

.donation-premium__badge span {
    color: #08af53 !important;
    font-size: 21px !important;
}

/* hero */

.donation-premium__hero {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1.2fr)
        minmax(220px, .8fr)
        !important;

    gap: 24px !important;

    align-items: center !important;

    margin-bottom: 27px !important;
}

#donation-modal .donation-premium__title {
    margin: 0 !important;

    color: #071d46 !important;

    font-size: clamp(42px, 5vw, 61px) !important;
    line-height: .98 !important;
    font-weight: 950 !important;

    letter-spacing: -.05em !important;

    text-align: left !important;
}

#donation-modal .donation-premium__lead {
    max-width: 530px !important;

    margin: 19px 0 0 !important;

    color: #566d90 !important;

    font-size: 19px !important;
    line-height: 1.4 !important;

    text-align: left !important;
}

/* decorative art */

.donation-premium__art {
    position: relative !important;

    min-height: 210px !important;
}

.donation-premium__brush {
    position: absolute !important;

    width: 230px !important;
    height: 110px !important;

    left: 50% !important;
    top: 70px !important;

    transform:
        translateX(-50%)
        rotate(-8deg)
        !important;

    border-radius: 50% !important;

    background:
        linear-gradient(
            100deg,
            rgba(220,249,232,.55),
            rgba(225,250,235,.92),
            rgba(241,253,246,.45)
        ) !important;
}

.donation-premium__heart {
    position: absolute !important;

    top: 0 !important;
    left: 50% !important;

    transform:
        translateX(-50%)
        rotate(-8deg)
        !important;

    color: #05aa50 !important;

    font-size: 103px !important;
    line-height: 1 !important;

    z-index: 2 !important;

    text-shadow:
        -10px 7px 0 rgba(35, 199, 107, .19) !important;
}

.donation-premium__handwriting {
    position: relative !important;
    z-index: 3 !important;

    padding-top: 115px !important;

    color: #08713d !important;

    font-family:
        "Comic Sans MS",
        "Segoe Print",
        cursive !important;

    font-size: 29px !important;
    line-height: .92 !important;

    text-align: center !important;

    transform: rotate(-7deg) !important;
}

.donation-premium__handwriting span {
    font-size: 36px !important;
}

/* grid */

#donation-modal .donation-premium__grid {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 14px !important;

    margin: 0 0 28px !important;
}

/*
 * Mantemos os botoes originais gerados pelo PHP.
 * Apenas mudamos a aparencia.
 */

#donation-modal
.donation-premium__grid
.pick-grid__item {
    min-width: 0 !important;
}

#donation-modal
.donation-premium__grid
.pick-btn--grid {
    width: 100% !important;

    min-height: 112px !important;

    border-radius: 18px !important;

    border: 1px solid #e1e7ee !important;

    background: #fff !important;

    color: #08753e !important;

    font-size: 24px !important;
    font-weight: 950 !important;

    box-shadow:
        0 7px 20px rgba(16, 41, 69, .055) !important;

    transition:
        transform .15s ease,
        border-color .15s ease,
        box-shadow .15s ease !important;
}

#donation-modal
.donation-premium__grid
.pick-btn--grid:hover {
    transform: translateY(-2px) !important;

    border-color: #a4dfbb !important;

    box-shadow:
        0 11px 26px rgba(5, 126, 61, .11) !important;
}

/* primeiro valor destacado */

#donation-modal
.donation-premium__grid
.pick-grid__item:first-child
.pick-btn--grid {
    color: #fff !important;

    background:
        linear-gradient(
            135deg,
            #06c35c,
            #00a94f
        ) !important;

    border-color: transparent !important;

    box-shadow:
        0 15px 32px rgba(3, 171, 80, .24) !important;
}

/* trust */

.donation-premium__trust {
    display: grid !important;

    grid-template-columns:
        repeat(3, 1fr) !important;

    gap: 15px !important;

    margin-bottom: 24px !important;
}

.donation-premium__trust-item {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 11px !important;

    color: #50688c !important;

    font-size: 14px !important;
    line-height: 1.2 !important;

    text-align: left !important;
}

.donation-premium__trust-icon {
    width: 42px !important;
    height: 42px !important;

    flex: 0 0 42px !important;

    display: grid !important;
    place-items: center !important;

    border: 2px solid #09aa53 !important;
    border-radius: 12px !important;

    color: #079f4d !important;

    font-size: 21px !important;
    font-weight: 900 !important;
}

/* thanks */

.donation-premium__thanks {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 20px !important;

    padding: 20px 23px !important;

    border: 1px solid #c5ecd6 !important;
    border-radius: 18px !important;

    background:
        linear-gradient(
            90deg,
            #eafbf2,
            #f0fcf5
        ) !important;
}

.donation-premium__thanks-left {
    display: flex !important;
    align-items: center !important;

    gap: 13px !important;

    color: #08703c !important;

    font-size: 16px !important;
}

.donation-premium__thanks-left strong {
    font-weight: 900 !important;
}

.donation-premium__thanks-heart {
    color: #08ae52 !important;
    font-size: 43px !important;
}

.donation-premium__thanks-right {
    color: #235a42 !important;

    font-family:
        "Comic Sans MS",
        "Segoe Print",
        cursive !important;

    font-size: 17px !important;

    text-align: center !important;

    transform: rotate(-3deg) !important;
}

#donation-modal .donation-premium__foot {
    margin: 12px 0 0 !important;

    font-size: 10px !important;

    color: #8a95a5 !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    #donation-modal.donation-premium {
        padding: 8px !important;
    }

    #donation-modal .donation-premium__panel {
        width: calc(100vw - 16px) !important;
        max-height: calc(100dvh - 16px) !important;

        padding: 21px 15px 16px !important;

        border-radius: 21px !important;
    }

    #donation-modal .donation-premium__close {
        top: 14px !important;
        right: 14px !important;

        width: 38px !important;
        height: 38px !important;

        font-size: 24px !important;
    }

    .donation-premium__badge {
        margin-bottom: 17px !important;

        padding: 8px 12px !important;

        font-size: 10px !important;
    }

    .donation-premium__hero {
        display: block !important;

        margin-bottom: 18px !important;
    }

    .donation-premium__art {
        display: none !important;
    }

    #donation-modal .donation-premium__title {
        padding-right: 45px !important;

        font-size: 30px !important;
        line-height: 1 !important;
    }

    #donation-modal .donation-premium__lead {
        margin-top: 11px !important;

        font-size: 13.5px !important;
        line-height: 1.38 !important;
    }

    #donation-modal .donation-premium__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 9px !important;

        margin-bottom: 18px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        min-height: 83px !important;

        border-radius: 14px !important;

        font-size: 18px !important;
    }

    .donation-premium__trust {
        gap: 6px !important;

        margin-bottom: 16px !important;
    }

    .donation-premium__trust-item {
        flex-direction: column !important;

        gap: 5px !important;

        font-size: 9px !important;

        text-align: center !important;
    }

    .donation-premium__trust-icon {
        width: 30px !important;
        height: 30px !important;

        flex-basis: 30px !important;

        border-radius: 8px !important;

        font-size: 15px !important;
    }

    .donation-premium__thanks {
        padding: 13px !important;

        gap: 10px !important;
    }

    .donation-premium__thanks-left {
        gap: 7px !important;

        font-size: 10.5px !important;
        line-height: 1.2 !important;
    }

    .donation-premium__thanks-heart {
        font-size: 29px !important;
    }

    .donation-premium__thanks-right {
        font-size: 10px !important;
    }
}


/* =========================================================
   MODAL V5 - COMPACTO / REFERENCIA
   OVERRIDE FINAL
   ========================================================= */

#donation-modal.donation-premium {
    padding: 10px !important;
}

#donation-modal .donation-premium__panel {
    width: min(900px, calc(100vw - 20px)) !important;
    max-height: calc(100dvh - 20px) !important;

    padding: 22px 24px 18px !important;

    border-radius: 26px !important;

    overflow-y: auto !important;
}

/* badge menor */

.donation-premium__badge {
    margin: 0 auto 14px !important;

    padding: 8px 15px !important;

    font-size: 12px !important;
}

.donation-premium__badge span {
    font-size: 18px !important;
}

/* hero mais compacto */

.donation-premium__hero {
    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(150px, .65fr)
        !important;

    gap: 12px !important;

    margin-bottom: 15px !important;
}

#donation-modal .donation-premium__title {
    font-size: clamp(36px, 4.5vw, 52px) !important;
    line-height: .96 !important;

    margin: 0 !important;
}

#donation-modal .donation-premium__lead {
    margin: 10px 0 0 !important;

    font-size: 15px !important;
    line-height: 1.3 !important;
}

/* arte menor */

.donation-premium__art {
    min-height: 125px !important;
}

.donation-premium__heart {
    font-size: 69px !important;
}

.donation-premium__brush {
    width: 155px !important;
    height: 72px !important;

    top: 43px !important;
}

.donation-premium__handwriting {
    padding-top: 70px !important;

    font-size: 20px !important;
}

.donation-premium__handwriting span {
    font-size: 25px !important;
}

/* =========================================================
   GRID - MAIS PROXIMO DA REFERENCIA
   ========================================================= */

#donation-modal .donation-premium__grid {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 8px !important;

    margin: 0 0 13px !important;
}

#donation-modal
.donation-premium__grid
.pick-btn--grid {
    position: relative !important;

    min-height: 74px !important;
    height: 74px !important;

    padding: 7px 5px 20px !important;

    border-radius: 14px !important;

    font-size: 21px !important;
    line-height: 1 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* descricoes visuais abaixo de cada valor */

#donation-modal
.donation-premium__grid
.pick-btn--grid::after {
    position: absolute !important;

    left: 4px !important;
    right: 4px !important;
    bottom: 7px !important;

    color: #657796 !important;

    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 500 !important;

    text-align: center !important;
}

/* Mantemos os valores reais existentes.
   Só adicionamos frases visuais. */

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(1)
.pick-btn--grid::after {
    content: "Já ajuda muito";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(2)
.pick-btn--grid::after {
    content: "Faz a diferença";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(3)
.pick-btn--grid::after {
    content: "Ajuda ainda mais";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(4)
.pick-btn--grid::after {
    content: "Mais esperança";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(5)
.pick-btn--grid::after {
    content: "Mais cuidado";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(6)
.pick-btn--grid::after {
    content: "Apoio importante";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(7)
.pick-btn--grid::after {
    content: "Ajuda a família";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(8)
.pick-btn--grid::after {
    content: "Mais esperança";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(9)
.pick-btn--grid::after {
    content: "Mais qualidade";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(10)
.pick-btn--grid::after {
    content: "Fortalece a luta";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(11)
.pick-btn--grid::after {
    content: "Leva mais cuidado";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(12)
.pick-btn--grid::after {
    content: "Apoio essencial";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(13)
.pick-btn--grid::after {
    content: "Um grande apoio";
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(14)
.pick-btn--grid::after {
    content: "Um grande impacto";
}

/* primeiro valor */

#donation-modal
.donation-premium__grid
.pick-grid__item:first-child
.pick-btn--grid::after {
    color: rgba(255,255,255,.92) !important;
}

/* =========================================================
   TRUST
   ========================================================= */

.donation-premium__trust {
    margin: 0 0 11px !important;

    gap: 8px !important;
}

.donation-premium__trust-item {
    gap: 7px !important;

    font-size: 11px !important;
}

.donation-premium__trust-icon {
    width: 32px !important;
    height: 32px !important;

    flex-basis: 32px !important;

    border-radius: 9px !important;

    font-size: 16px !important;
}

/* =========================================================
   THANKS
   ========================================================= */

.donation-premium__thanks {
    padding: 11px 15px !important;

    border-radius: 14px !important;

    min-height: 46px !important;
}

.donation-premium__thanks-left {
    gap: 8px !important;

    font-size: 11px !important;
}

.donation-premium__thanks-heart {
    font-size: 27px !important;
}

.donation-premium__thanks-right {
    font-size: 11px !important;
}

#donation-modal .donation-premium__foot {
    display: none !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    #donation-modal.donation-premium {
        padding: 5px !important;
    }

    #donation-modal .donation-premium__panel {
        width: calc(100vw - 10px) !important;
        max-height: calc(100dvh - 10px) !important;

        padding: 15px 12px 12px !important;

        border-radius: 19px !important;
    }

    #donation-modal .donation-premium__close {
        top: 11px !important;
        right: 11px !important;

        width: 34px !important;
        height: 34px !important;

        font-size: 21px !important;
    }

    .donation-premium__badge {
        margin-bottom: 9px !important;

        padding: 6px 9px !important;

        font-size: 8.5px !important;
    }

    .donation-premium__badge span {
        font-size: 13px !important;
    }

    /* titulo + arte lado a lado */

    .donation-premium__hero {
        display: grid !important;

        grid-template-columns:
            minmax(0, 1.55fr)
            minmax(85px, .45fr)
            !important;

        align-items: center !important;

        gap: 3px !important;

        margin-bottom: 10px !important;
    }

    #donation-modal .donation-premium__title {
        padding-right: 0 !important;

        font-size: 25px !important;
        line-height: .96 !important;

        letter-spacing: -.04em !important;
    }

    #donation-modal .donation-premium__lead {
        margin-top: 7px !important;

        font-size: 10.5px !important;
        line-height: 1.25 !important;
    }

    /* mostra arte no mobile */

    .donation-premium__art {
        display: block !important;

        min-height: 94px !important;
    }

    .donation-premium__heart {
        top: 0 !important;

        font-size: 50px !important;

        text-shadow:
            -5px 4px 0 rgba(35,199,107,.18) !important;
    }

    .donation-premium__brush {
        width: 90px !important;
        height: 42px !important;

        top: 33px !important;
    }

    .donation-premium__handwriting {
        padding-top: 51px !important;

        font-size: 12px !important;
    }

    .donation-premium__handwriting span {
        font-size: 15px !important;
    }

    /* 3 COLUNAS NO CELULAR */

    #donation-modal .donation-premium__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 6px !important;

        margin-bottom: 9px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        min-height: 58px !important;
        height: 58px !important;

        padding:
            5px 2px 17px !important;

        border-radius: 11px !important;

        font-size: 15px !important;

        letter-spacing: -.02em !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid::after {
        bottom: 5px !important;

        font-size: 7.4px !important;
    }

    /* última célula pode ocupar 2 colunas se necessário */

    #donation-modal
    .donation-premium__grid
    .pick-grid__item:last-child {
        grid-column: span 2 !important;
    }

    /* segurança compacta */

    .donation-premium__trust {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        margin-bottom: 8px !important;
    }

    .donation-premium__trust-item {
        flex-direction: row !important;

        gap: 4px !important;

        font-size: 7.5px !important;
        line-height: 1.1 !important;

        text-align: left !important;
    }

    .donation-premium__trust-icon {
        width: 24px !important;
        height: 24px !important;

        flex-basis: 24px !important;

        border-width: 1.5px !important;
        border-radius: 6px !important;

        font-size: 12px !important;
    }

    /* rodape compacto */

    .donation-premium__thanks {
        padding: 8px 9px !important;

        min-height: 38px !important;
    }

    .donation-premium__thanks-left {
        font-size: 8px !important;
    }

    .donation-premium__thanks-heart {
        font-size: 20px !important;
    }

    .donation-premium__thanks-right {
        font-size: 8px !important;
    }
}

@media (max-width: 380px) {

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        height: 54px !important;
        min-height: 54px !important;

        font-size: 13px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid::after {
        font-size: 6.6px !important;
    }

    #donation-modal .donation-premium__title {
        font-size: 22px !important;
    }
}


/* =========================================================
   MODAL V6 - EQUILIBRIO VISUAL MOBILE
   ========================================================= */

@media (max-width: 700px) {

    #donation-modal.donation-premium {
        padding: 8px !important;
    }

    #donation-modal .donation-premium__panel {
        width: calc(100vw - 16px) !important;
        max-height: calc(100dvh - 16px) !important;

        padding: 18px 14px 14px !important;

        border-radius: 22px !important;
    }

    #donation-modal .donation-premium__close {
        top: 14px !important;
        right: 14px !important;

        width: 38px !important;
        height: 38px !important;

        font-size: 23px !important;
    }

    .donation-premium__badge {
        margin-bottom: 12px !important;

        padding: 8px 13px !important;

        font-size: 10px !important;
    }

    .donation-premium__badge span {
        font-size: 15px !important;
    }

    .donation-premium__hero {
        grid-template-columns:
            minmax(0, 1.45fr)
            minmax(95px, .55fr)
            !important;

        gap: 8px !important;

        margin-bottom: 13px !important;
    }

    #donation-modal .donation-premium__title {
        font-size: 29px !important;
        line-height: .98 !important;
    }

    #donation-modal .donation-premium__lead {
        margin-top: 8px !important;

        font-size: 12px !important;
        line-height: 1.3 !important;
    }

    .donation-premium__art {
        min-height: 108px !important;
    }

    .donation-premium__heart {
        font-size: 59px !important;
    }

    .donation-premium__brush {
        width: 105px !important;
        height: 48px !important;

        top: 38px !important;
    }

    .donation-premium__handwriting {
        padding-top: 59px !important;

        font-size: 14px !important;
        line-height: .95 !important;
    }

    .donation-premium__handwriting span {
        font-size: 17px !important;
    }

    /* grid */

    #donation-modal .donation-premium__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 8px !important;

        margin-bottom: 12px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        height: 70px !important;
        min-height: 70px !important;

        padding: 8px 4px 20px !important;

        border-radius: 13px !important;

        font-size: 17px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid::after {
        bottom: 6px !important;

        font-size: 8.3px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-grid__item:last-child {
        grid-column: span 2 !important;
    }

    /* trust */

    .donation-premium__trust {
        gap: 8px !important;

        margin-bottom: 11px !important;
    }

    .donation-premium__trust-item {
        gap: 5px !important;

        font-size: 8.5px !important;
        line-height: 1.15 !important;
    }

    .donation-premium__trust-icon {
        width: 28px !important;
        height: 28px !important;

        flex-basis: 28px !important;

        font-size: 13px !important;
    }

    /* rodape */

    .donation-premium__thanks {
        min-height: 46px !important;

        padding: 10px 11px !important;

        border-radius: 13px !important;
    }

    .donation-premium__thanks-left {
        font-size: 9px !important;
    }

    .donation-premium__thanks-heart {
        font-size: 24px !important;
    }

    .donation-premium__thanks-right {
        font-size: 9px !important;
        line-height: 1.1 !important;
    }
}

@media (max-width: 390px) {

    #donation-modal .donation-premium__title {
        font-size: 27px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        height: 66px !important;
        min-height: 66px !important;

        font-size: 16px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid::after {
        font-size: 7.7px !important;
    }
}


/* =========================================================
   MODAL V7 - TODOS OS VALORES NO MESMO PADRAO
   ========================================================= */

#donation-modal
.donation-premium__grid
.pick-grid__item:first-child
.pick-btn--grid {
    background: #ffffff !important;
    color: #08753e !important;
    border: 1px solid #e1e7ee !important;

    box-shadow:
        0 7px 20px rgba(16, 41, 69, .055) !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:first-child
.pick-btn--grid::after {
    color: #657796 !important;
}


/* =========================================================
   CTA FIXO V8 - MAIS CHAMATIVO
   ========================================================= */

.dock {
    background: rgba(255,255,255,.96) !important;

    border-top: 1px solid #e8edf2 !important;

    box-shadow:
        0 -8px 28px rgba(8, 37, 67, .10) !important;

    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;

    padding:
        10px 14px
        calc(10px + env(safe-area-inset-bottom))
        !important;
}

.dock__btn {
    width: min(100%, 520px) !important;
    max-width: 520px !important;

    min-height: 58px !important;

    margin: 0 auto !important;

    border-radius: 18px !important;

    background:
        linear-gradient(
            135deg,
            #05c95f 0%,
            #00a94f 55%,
            #078d45 100%
        ) !important;

    color: #fff !important;

    box-shadow:
        0 10px 28px rgba(0, 158, 74, .28),
        inset 0 1px 0 rgba(255,255,255,.22)
        !important;

    font-size: 18px !important;
    font-weight: 900 !important;

    letter-spacing: -.01em !important;

    border: 1px solid rgba(0, 127, 58, .18) !important;

    position: relative !important;
    overflow: hidden !important;

    transition:
        transform .16s ease,
        box-shadow .16s ease,
        filter .16s ease
        !important;
}

.dock__btn::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: -35% !important;

    width: 30% !important;
    height: 100% !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.26),
            transparent
        ) !important;

    transform: skewX(-20deg) !important;

    animation: ctaShine 3.2s ease-in-out infinite !important;
}

.dock__btn:hover {
    transform: translateY(-2px) scale(1.01) !important;

    box-shadow:
        0 14px 34px rgba(0, 158, 74, .34),
        inset 0 1px 0 rgba(255,255,255,.24)
        !important;
}

.dock__btn:active {
    transform: scale(.985) !important;
}

.dock__icon {
    width: 34px !important;
    height: 34px !important;

    display: inline-grid !important;
    place-items: center !important;

    border-radius: 50% !important;

    background: rgba(255,255,255,.16) !important;

    font-size: 18px !important;
}

.dock__text {
    position: relative !important;
    z-index: 2 !important;
}

@keyframes ctaShine {
    0% {
        left: -35%;
    }

    55%,
    100% {
        left: 120%;
    }
}

/* MOBILE */

@media (max-width: 700px) {

    .dock {
        padding:
            9px 12px
            calc(9px + env(safe-area-inset-bottom))
            !important;
    }

    .dock__btn {
        width: 100% !important;

        min-height: 56px !important;

        border-radius: 17px !important;

        font-size: 17px !important;
    }

    .dock__icon {
        width: 30px !important;
        height: 30px !important;

        font-size: 16px !important;
    }
}


/* =========================================================
   STORY V9 - LEITURA PREMIUM
   ========================================================= */

.article {
    padding: 34px 34px 38px !important;

    border: 1px solid #e7edf3 !important;
    border-radius: 24px !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #ffffff 82%,
            #fbfdfc 100%
        ) !important;

    box-shadow:
        0 12px 34px rgba(11, 36, 66, .07) !important;
}

/* cabeçalho da história */

.article__head {
    margin-bottom: 26px !important;
    padding-bottom: 20px !important;

    border-bottom: 1px solid #edf1f4 !important;
}

.article__head h2 {
    margin: 0 !important;

    color: #071d46 !important;

    font-family:
        Inter,
        "Segoe UI",
        Arial,
        sans-serif !important;

    font-size: 34px !important;
    line-height: 1 !important;
    font-weight: 900 !important;

    letter-spacing: -.04em !important;
}

.article__meta {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;

    gap: 6px !important;

    margin-top: 10px !important;

    color: #8190a6 !important;

    font-size: 13px !important;
    line-height: 1.3 !important;
}

/* corpo */

.article__body {
    max-width: 820px !important;
    margin: 0 auto !important;
}

.story__article {
    color: #233a5c !important;

    font-family:
        Inter,
        "Segoe UI",
        Arial,
        sans-serif !important;

    font-size: 17.5px !important;
    line-height: 1.72 !important;

    letter-spacing: -.005em !important;
}

/* parágrafos */

.story__article p {
    margin: 0 0 16px !important;

    color: #2d4262 !important;
}

/* títulos internos */

.story__article h2 {
    position: relative !important;

    margin: 38px 0 14px !important;
    padding-left: 18px !important;

    color: #071d46 !important;

    font-size: 25px !important;
    line-height: 1.16 !important;
    font-weight: 900 !important;

    letter-spacing: -.028em !important;
}

.story__article h2:first-child {
    margin-top: 0 !important;
}

/* barrinha lateral elegante */

.story__article h2::before {
    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 2px !important;

    width: 5px !important;
    height: calc(100% - 4px) !important;

    border-radius: 999px !important;

    background:
        linear-gradient(
            180deg,
            #08bd59,
            #048c43
        ) !important;
}

/* destaques */

.story__article strong,
.story__article b {
    color: #071d46 !important;
    font-weight: 800 !important;
}

/* listas */

.story__article ul {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    gap: 11px !important;

    margin: 20px 0 28px !important;
    padding: 0 !important;

    list-style: none !important;
}

.story__article li {
    margin: 0 !important;

    padding: 14px 15px !important;

    border: 1px solid #dcebe3 !important;
    border-radius: 14px !important;

    background:
        linear-gradient(
            135deg,
            #f4fcf7,
            #fbfefd
        ) !important;

    color: #254a36 !important;

    font-size: 14px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;

    box-shadow:
        0 4px 12px rgba(8, 74, 42, .035) !important;
}

/* botão dentro da história */

.article__donate {
    min-height: 58px !important;

    margin-top: 32px !important;

    border-radius: 16px !important;

    font-size: 17px !important;
    font-weight: 900 !important;

    background:
        linear-gradient(
            135deg,
            #06c45d,
            #029a49
        ) !important;

    box-shadow:
        0 10px 28px rgba(0, 158, 74, .20) !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .article {
        padding: 24px 18px 28px !important;

        border-radius: 20px !important;
    }

    .article__head {
        margin-bottom: 22px !important;
        padding-bottom: 16px !important;
    }

    .article__head h2 {
        font-size: 28px !important;
        line-height: 1.02 !important;
    }

    .article__meta {
        margin-top: 8px !important;

        font-size: 12px !important;
    }

    .article__body {
        max-width: 100% !important;
    }

    .story__article {
        font-size: 16px !important;
        line-height: 1.66 !important;
    }

    .story__article p {
        margin-bottom: 14px !important;
    }

    .story__article h2 {
        margin: 30px 0 11px !important;

        padding-left: 15px !important;

        font-size: 22px !important;
        line-height: 1.18 !important;
    }

    .story__article h2::before {
        width: 4px !important;
    }

    .story__article ul {
        grid-template-columns: 1fr !important;

        gap: 8px !important;

        margin: 17px 0 23px !important;
    }

    .story__article li {
        padding: 12px 13px !important;

        font-size: 13.5px !important;
    }

    .article__donate {
        min-height: 55px !important;

        margin-top: 25px !important;

        font-size: 16px !important;
    }
}


/* =========================================================
   STORY V10 - BLOCOS MAIS BONITOS E ESCANEAVEIS
   ========================================================= */

/* cada seção interna ganha mais separação */

.story__article h2 + p {
    margin-top: 0 !important;
}

/* cria um bloco visual para os parágrafos que vêm após o título */

.story__article h2 + p,
.story__article h2 + p + p,
.story__article h2 + p + p + p {
    position: relative !important;
}

/*
 * Primeiro conjunto de parágrafos:
 * visual de card suave, sem mexer no HTML.
 */

.story__article h2:first-child + p {
    margin-top: 14px !important;

    padding:
        18px 18px 6px !important;

    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;

    border-top: 1px solid #e4ebf1 !important;
    border-left: 1px solid #e4ebf1 !important;
    border-right: 1px solid #e4ebf1 !important;

    background:
        linear-gradient(
            180deg,
            #fbfdff,
            #f8fbfd
        ) !important;
}

.story__article h2:first-child + p + p {
    margin-top: -16px !important;

    padding:
        8px 18px 6px !important;

    border-left: 1px solid #e4ebf1 !important;
    border-right: 1px solid #e4ebf1 !important;

    background: #f8fbfd !important;
}

.story__article h2:first-child + p + p + p {
    margin-top: -16px !important;

    padding:
        8px 18px 18px !important;

    border-bottom-left-radius: 16px !important;
    border-bottom-right-radius: 16px !important;

    border-left: 1px solid #e4ebf1 !important;
    border-right: 1px solid #e4ebf1 !important;
    border-bottom: 1px solid #e4ebf1 !important;

    background:
        linear-gradient(
            180deg,
            #f8fbfd,
            #ffffff
        ) !important;

    box-shadow:
        0 7px 18px rgba(10, 37, 66, .045) !important;
}

/* tipografia dentro da história */

.story__article p {
    color: #314866 !important;

    font-size: 17px !important;
    line-height: 1.68 !important;

    letter-spacing: -.008em !important;
}

/* strong menos agressivo */

.story__article strong {
    color: #0b2348 !important;

    font-weight: 800 !important;
}

/* títulos internos com mais acabamento */

.story__article h2 {
    padding-left: 17px !important;

    color: #071d46 !important;

    font-size: 24px !important;
    line-height: 1.17 !important;

    letter-spacing: -.03em !important;
}

.story__article h2::before {
    top: 1px !important;
    bottom: 1px !important;

    width: 4px !important;
    height: auto !important;

    border-radius: 999px !important;
}

/* espaço maior antes de cada novo capítulo */

.story__article h2:not(:first-child) {
    margin-top: 36px !important;
}

/* pequena separação depois do bloco introdutório */

.story__article h2:first-child + p + p + p + h2 {
    margin-top: 40px !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .story__article p {
        font-size: 15.8px !important;
        line-height: 1.63 !important;
    }

    .story__article h2 {
        font-size: 21px !important;
        line-height: 1.18 !important;

        padding-left: 14px !important;
    }

    .story__article h2:first-child + p {
        padding:
            15px 14px 5px !important;

        border-radius:
            14px 14px 0 0 !important;
    }

    .story__article h2:first-child + p + p {
        padding:
            7px 14px 5px !important;
    }

    .story__article h2:first-child + p + p + p {
        padding:
            7px 14px 15px !important;

        border-radius:
            0 0 14px 14px !important;
    }

    .story__article h2:not(:first-child) {
        margin-top: 30px !important;
    }

    .story__article h2:first-child + p + p + p + h2 {
        margin-top: 34px !important;
    }
}


/* =========================================================
   HERO TITLE V11 - MAIS EQUILIBRADO
   ========================================================= */

@media (max-width: 700px) {

    /* Titulo principal da campanha */
    .hero__title,
    .campaign-hero__title,
    .campaign__title,
    .hero h1,
    main h1 {
        font-size: 30px !important;
        line-height: 1.08 !important;
        letter-spacing: -0.8px !important;
        font-weight: 900 !important;

        margin-top: 14px !important;
        margin-bottom: 13px !important;
    }

    /* Subtitulo */
    .hero__subtitle,
    .campaign-hero__subtitle,
    .campaign__subtitle,
    .hero h1 + p {
        font-size: 15.5px !important;
        line-height: 1.48 !important;

        margin-bottom: 18px !important;
    }
}

/* Celulares menores */

@media (max-width: 390px) {

    .hero__title,
    .campaign-hero__title,
    .campaign__title,
    .hero h1,
    main h1 {
        font-size: 28px !important;
        line-height: 1.08 !important;
        letter-spacing: -0.6px !important;
    }
}

/* =========================================================
   HERO V12 - TITULO MENOR + SUBTITULO MAIS LEGIVEL
   ========================================================= */

@media (max-width: 700px) {

    /* TITULO PRINCIPAL */
    body .hero h1,
    body main .hero h1,
    body .hero__title,
    body .campaign__title,
    body .campaign-hero__title {
        font-size: 26px !important;
        line-height: 1.10 !important;

        font-weight: 850 !important;
        letter-spacing: -0.55px !important;

        color: #071d46 !important;

        margin-top: 12px !important;
        margin-bottom: 13px !important;

        max-width: 100% !important;
    }

    /* SUBTITULO */
    body .hero h1 + p,
    body .hero__subtitle,
    body .campaign__subtitle,
    body .campaign-hero__subtitle {
        font-size: 16px !important;
        line-height: 1.48 !important;

        font-weight: 600 !important;

        letter-spacing: -0.1px !important;

        color: #314968 !important;

        opacity: 1 !important;

        margin-top: 0 !important;
        margin-bottom: 19px !important;

        max-width: 100% !important;
    }
}

/* aparelhos mais estreitos */
@media (max-width: 390px) {

    body .hero h1,
    body main .hero h1,
    body .hero__title,
    body .campaign__title,
    body .campaign-hero__title {
        font-size: 25px !important;
        line-height: 1.10 !important;
    }

    body .hero h1 + p,
    body .hero__subtitle,
    body .campaign__subtitle,
    body .campaign-hero__subtitle {
        font-size: 15px !important;
        line-height: 1.46 !important;
    }
}


/* =========================================================
   HERO V13 - SELETOR REAL
   ========================================================= */

@media (max-width: 700px) {

    body .intro .intro__title {
        font-size: 23px !important;
        line-height: 1.12 !important;

        font-weight: 850 !important;
        letter-spacing: -0.35px !important;

        color: #071d46 !important;

        max-width: 100% !important;

        margin-top: 0 !important;
        margin-bottom: 12px !important;

        text-align: left !important;
    }

    body .intro .intro__subtitle {
        font-size: 15.5px !important;
        line-height: 1.50 !important;

        font-weight: 600 !important;

        color: #2f496b !important;

        opacity: 1 !important;

        max-width: 100% !important;

        margin-top: 0 !important;
        margin-bottom: 18px !important;

        text-align: left !important;
    }
}

@media (max-width: 390px) {

    body .intro .intro__title {
        font-size: 22px !important;
        line-height: 1.12 !important;
    }

    body .intro .intro__subtitle {
        font-size: 15px !important;
        line-height: 1.48 !important;
    }
}


/* =========================================================
   HERO V14 - SUBTITULO MENOR
   ========================================================= */

@media (max-width: 700px) {

    body .intro .intro__subtitle {
        font-size: 13px !important;
        line-height: 1.48 !important;
        font-weight: 500 !important;

        color: #3d5575 !important;
        opacity: 1 !important;

        margin-top: 0 !important;
        margin-bottom: 17px !important;

        letter-spacing: 0 !important;
    }
}

@media (max-width: 390px) {

    body .intro .intro__subtitle {
        font-size: 12.5px !important;
        line-height: 1.48 !important;
    }
}



/* =========================================================
   PIX PREMIUM V1
   ========================================================= */

#pix-modal.pix-premium {
    padding: 18px !important;
}

#pix-modal .pix-premium__panel {
    position: relative !important;

    width: min(900px, calc(100vw - 36px)) !important;
    max-height: calc(100dvh - 36px) !important;

    padding: 30px 34px 26px !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    border: 1px solid #e3eaf1 !important;
    border-radius: 30px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #ffffff 75%,
            #fbfdfc 100%
        ) !important;

    box-shadow:
        0 30px 90px rgba(3, 25, 51, .28) !important;
}

/* fechar */

#pix-modal .pix-premium__close {
    top: 23px !important;
    right: 23px !important;

    width: 47px !important;
    height: 47px !important;

    border-radius: 50% !important;

    background: #fff !important;
    border: 1px solid #e8edf2 !important;

    color: #172238 !important;

    font-size: 29px !important;

    box-shadow:
        0 7px 22px rgba(16, 36, 61, .10) !important;
}

/* topo */

.pix-premium__topline {
    display: flex !important;
    align-items: center !important;

    gap: 9px !important;

    margin: 0 0 20px !important;

    color: #0b7b42 !important;

    font-size: 15px !important;
    font-weight: 800 !important;
}

.pix-premium__heart {
    color: #07ac52 !important;

    font-size: 29px !important;
    line-height: 1 !important;
}

.pix-premium__hero {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1.3fr)
        minmax(190px, .7fr)
        !important;

    gap: 20px !important;

    align-items: center !important;

    margin-bottom: 24px !important;
}

.pix-premium__title {
    margin: 0 !important;

    color: #071d46 !important;

    font-size: clamp(42px, 5vw, 58px) !important;
    line-height: 1 !important;
    font-weight: 950 !important;

    letter-spacing: -.05em !important;
}

.pix-premium__subtitle {
    max-width: 570px !important;

    margin: 12px 0 0 !important;

    color: #5c7192 !important;

    font-size: 18px !important;
    line-height: 1.4 !important;

    font-weight: 500 !important;
}

/* arte */

.pix-premium__art {
    position: relative !important;

    min-height: 135px !important;
}

.pix-premium__brush {
    position: absolute !important;

    width: 190px !important;
    height: 112px !important;

    left: 50% !important;
    top: 7px !important;

    transform:
        translateX(-50%)
        rotate(-8deg)
        !important;

    border-radius: 50% !important;

    background:
        linear-gradient(
            100deg,
            rgba(222,249,232,.5),
            rgba(225,249,234,.95),
            rgba(240,253,245,.45)
        ) !important;
}

.pix-premium__handwriting {
    position: relative !important;
    z-index: 2 !important;

    padding-top: 30px !important;

    color: #08723d !important;

    font-family:
        "Comic Sans MS",
        "Segoe Print",
        cursive !important;

    font-size: 25px !important;
    line-height: 1 !important;

    text-align: center !important;

    transform: rotate(-7deg) !important;
}

/* resumo */

#pix-modal .pix-premium__summary {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr)
        !important;

    gap: 28px !important;

    align-items: center !important;

    margin: 0 0 21px !important;
    padding: 20px 25px !important;

    border: 1px solid #dfe7ef !important;
    border-radius: 20px !important;

    background:
        linear-gradient(
            145deg,
            #fbfdff,
            #ffffff
        ) !important;
}

#pix-modal .pix-premium__summary-block {
    min-width: 0 !important;
}

#pix-modal .pay-top__label {
    color: #7184a3 !important;

    font-size: 12px !important;
    font-weight: 800 !important;

    letter-spacing: .035em !important;
}

#pix-modal .pay-top__value {
    display: block !important;

    margin-top: 6px !important;

    color: #087a40 !important;

    font-size: 38px !important;
    line-height: 1 !important;
    font-weight: 950 !important;

    letter-spacing: -.035em !important;
}

.pix-premium__divider {
    width: 1px !important;
    height: 72px !important;

    background: #e2e8ee !important;
}

.pix-premium__timer-row {
    display: flex !important;
    align-items: center !important;

    gap: 8px !important;

    margin-top: 5px !important;
}

.pix-premium__clock {
    color: #078443 !important;

    font-size: 35px !important;
    line-height: 1 !important;
}

#pix-modal .pay-top__timer {
    color: #087a40 !important;

    font-size: 31px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
}

.pix-premium__timer-hint {
    display: block !important;

    margin-top: 7px !important;

    color: #6e7f99 !important;

    font-size: 11px !important;
}

/* qr */

.pix-premium__qr-section {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 28px !important;

    min-height: 260px !important;

    margin-bottom: 18px !important;
}

#pix-modal .pix-premium__qr {
    margin: 0 !important;

    padding: 20px !important;

    border: 1px solid #e3e9ef !important;
    border-radius: 22px !important;

    background: #fff !important;

    box-shadow:
        0 10px 28px rgba(12, 37, 67, .07) !important;
}

#pix-modal #pix-qr-image {
    width: 230px !important;
    height: 230px !important;

    display: block !important;

    border: 0 !important;
    border-radius: 0 !important;
}

.pix-premium__qr-note {
    min-width: 155px !important;

    color: #2c486e !important;

    font-family:
        "Comic Sans MS",
        "Segoe Print",
        cursive !important;

    font-size: 19px !important;
    line-height: 1.15 !important;

    text-align: center !important;

    transform: rotate(-5deg) !important;
}

.pix-premium__qr-note strong {
    display: block !important;

    margin-top: 8px !important;

    color: #08a650 !important;

    font-size: 50px !important;
    line-height: .7 !important;
}

/* codigo */

#pix-modal .pix-premium__code {
    position: relative !important;

    display: flex !important;
    align-items: center !important;

    min-height: 58px !important;

    margin: 0 0 12px !important;
    padding: 0 58px 0 17px !important;

    border: 1px solid #dde6ee !important;
    border-radius: 15px !important;

    background: #fbfcfe !important;

    overflow: hidden !important;
}

#pix-modal .pay-code__preview {
    width: 100% !important;

    margin: 0 !important;

    overflow: hidden !important;

    color: #334b70 !important;

    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        Consolas,
        monospace !important;

    font-size: 13px !important;

    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

.pix-premium__copy-symbol {
    position: absolute !important;

    right: 15px !important;
    top: 50% !important;

    transform: translateY(-50%) !important;

    color: #506889 !important;

    font-size: 27px !important;
}

/* botao copiar */

#pix-modal .pix-premium__copy {
    width: 100% !important;

    min-height: 58px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 10px !important;

    margin: 0 0 21px !important;

    border: 0 !important;
    border-radius: 15px !important;

    background:
        linear-gradient(
            135deg,
            #05c45d,
            #009f4a
        ) !important;

    color: #fff !important;

    font-size: 18px !important;
    font-weight: 900 !important;

    box-shadow:
        0 10px 25px rgba(0,158,74,.20) !important;
}

/* como pagar */

.pix-premium__guide-title {
    margin: 0 0 11px !important;

    color: #071d46 !important;

    font-size: 20px !important;
    font-weight: 900 !important;
}

#pix-modal .pix-premium__guide {
    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr))
        !important;

    gap: 12px !important;

    margin: 0 0 22px !important;
    padding: 0 !important;

    list-style: none !important;
}

#pix-modal .pix-premium__guide .pay-guide__item {
    position: relative !important;

    min-height: 170px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    gap: 8px !important;

    padding: 18px 11px 13px !important;

    border: 1px solid #e1eee6 !important;
    border-radius: 17px !important;

    background:
        linear-gradient(
            155deg,
            #f4fcf7,
            #fbfefd
        ) !important;

    text-align: center !important;
}

#pix-modal .pay-guide__num {
    position: absolute !important;

    top: 10px !important;
    left: 10px !important;

    width: 27px !important;
    height: 27px !important;

    display: grid !important;
    place-items: center !important;

    border-radius: 50% !important;

    background: #08a84f !important;

    color: #fff !important;

    font-size: 12px !important;
    font-weight: 900 !important;
}

.pix-premium__guide-icon {
    margin-top: 10px !important;

    color: #08a650 !important;

    font-size: 34px !important;
    line-height: 1 !important;
}

#pix-modal .pay-guide__text {
    display: flex !important;
    flex-direction: column !important;

    gap: 5px !important;
}

#pix-modal .pay-guide__text strong {
    color: #10264a !important;

    font-size: 14px !important;
    line-height: 1.25 !important;
}

#pix-modal .pay-guide__text span {
    color: #647795 !important;

    font-size: 11px !important;
    line-height: 1.3 !important;
}

/* seguranca */

.pix-premium__security {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;

    gap: 10px !important;

    padding-top: 18px !important;

    border-top: 1px solid #edf1f4 !important;
}

.pix-premium__security > div {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 10px !important;

    color: #536b90 !important;

    font-size: 13px !important;
    line-height: 1.2 !important;
}

.pix-premium__security-icon {
    width: 39px !important;
    height: 39px !important;

    display: grid !important;
    place-items: center !important;

    flex: 0 0 39px !important;

    color: #079f4d !important;

    border: 2px solid #08aa52 !important;
    border-radius: 11px !important;

    font-size: 20px !important;
}

/* status */

#pix-modal .pix-premium__status {
    margin-top: 15px !important;

    font-size: 12px !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    #pix-modal.pix-premium {
        padding: 7px !important;
    }

    #pix-modal .pix-premium__panel {
        width: calc(100vw - 14px) !important;
        max-height: calc(100dvh - 14px) !important;

        padding: 19px 14px 16px !important;

        border-radius: 21px !important;
    }

    #pix-modal .pix-premium__close {
        top: 13px !important;
        right: 13px !important;

        width: 37px !important;
        height: 37px !important;

        font-size: 23px !important;
    }

    .pix-premium__topline {
        margin-bottom: 11px !important;

        font-size: 10px !important;
    }

    .pix-premium__heart {
        font-size: 20px !important;
    }

    .pix-premium__hero {
        display: block !important;

        margin-bottom: 13px !important;
    }

    .pix-premium__art {
        display: none !important;
    }

    .pix-premium__title {
        padding-right: 40px !important;

        font-size: 27px !important;
        line-height: 1 !important;
    }

    .pix-premium__subtitle {
        margin-top: 7px !important;

        font-size: 12px !important;
        line-height: 1.35 !important;
    }

    #pix-modal .pix-premium__summary {
        grid-template-columns:
            minmax(0, 1fr)
            auto
            minmax(0, 1fr)
            !important;

        gap: 11px !important;

        margin-bottom: 12px !important;

        padding: 13px 14px !important;

        border-radius: 15px !important;
    }

    #pix-modal .pay-top__label {
        font-size: 8.5px !important;
    }

    #pix-modal .pay-top__value {
        font-size: 25px !important;
    }

    .pix-premium__divider {
        height: 52px !important;
    }

    .pix-premium__clock {
        font-size: 23px !important;
    }

    #pix-modal .pay-top__timer {
        font-size: 22px !important;
    }

    .pix-premium__timer-hint {
        display: none !important;
    }

    .pix-premium__qr-section {
        gap: 0 !important;

        min-height: 0 !important;

        margin-bottom: 10px !important;
    }

    #pix-modal .pix-premium__qr {
        padding: 12px !important;

        border-radius: 17px !important;
    }

    #pix-modal #pix-qr-image {
        width: 190px !important;
        height: 190px !important;
    }

    .pix-premium__qr-note {
        display: none !important;
    }

    #pix-modal .pix-premium__code {
        min-height: 48px !important;

        margin-bottom: 8px !important;

        padding-left: 12px !important;
        padding-right: 44px !important;

        border-radius: 12px !important;
    }

    #pix-modal .pay-code__preview {
        font-size: 10px !important;
    }

    .pix-premium__copy-symbol {
        right: 12px !important;

        font-size: 21px !important;
    }

    #pix-modal .pix-premium__copy {
        min-height: 50px !important;

        margin-bottom: 13px !important;

        border-radius: 13px !important;

        font-size: 15px !important;
    }

    .pix-premium__guide-title {
        margin-bottom: 8px !important;

        font-size: 16px !important;
    }

    #pix-modal .pix-premium__guide {
        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;

        gap: 8px !important;

        margin-bottom: 14px !important;
    }

    #pix-modal .pix-premium__guide .pay-guide__item {
        min-height: 112px !important;

        padding: 13px 7px 9px !important;

        border-radius: 13px !important;
    }

    #pix-modal .pay-guide__num {
        top: 7px !important;
        left: 7px !important;

        width: 22px !important;
        height: 22px !important;

        font-size: 9px !important;
    }

    .pix-premium__guide-icon {
        margin-top: 6px !important;

        font-size: 24px !important;
    }

    #pix-modal .pay-guide__text strong {
        font-size: 11px !important;
    }

    #pix-modal .pay-guide__text span {
        font-size: 8.5px !important;
    }

    .pix-premium__security {
        gap: 4px !important;

        padding-top: 11px !important;
    }

    .pix-premium__security > div {
        gap: 5px !important;

        font-size: 8px !important;
    }

    .pix-premium__security-icon {
        width: 28px !important;
        height: 28px !important;

        flex-basis: 28px !important;

        border-radius: 8px !important;
        border-width: 1.5px !important;

        font-size: 14px !important;
    }

    #pix-modal .pix-premium__status {
        margin-top: 9px !important;

        font-size: 9px !important;
    }
}


/* =========================================================
   PIX ICONS V2 - MELHORIAS VISUAIS
   ========================================================= */

/* remove aparência antiga dos símbolos */
#pix-modal .pix-premium__guide-icon {
    width: 42px !important;
    height: 42px !important;

    display: grid !important;
    place-items: center !important;

    margin-top: 10px !important;

    border-radius: 12px !important;

    background:
        linear-gradient(
            145deg,
            #ebfbf2,
            #f7fdf9
        ) !important;

    border: 1px solid #ccebd9 !important;

    color: #08a650 !important;

    font-family:
        Arial,
        sans-serif !important;

    font-size: 0 !important;

    box-shadow:
        0 4px 12px rgba(6, 130, 62, .07) !important;
}

/* 1 - CELULAR */
#pix-modal
.pix-premium__guide
.pay-guide__item:nth-child(1)
.pix-premium__guide-icon::before {
    content: "📱" !important;

    font-size: 25px !important;
    line-height: 1 !important;
}

/* 2 - AREA PIX / QR */
#pix-modal
.pix-premium__guide
.pay-guide__item:nth-child(2)
.pix-premium__guide-icon::before {
    content: "▦" !important;

    font-size: 28px !important;
    line-height: 1 !important;

    color: #08a650 !important;
}

/* 3 - COPIAR CODIGO */
#pix-modal
.pix-premium__guide
.pay-guide__item:nth-child(3)
.pix-premium__guide-icon::before {
    content: "▣" !important;

    font-size: 27px !important;
    line-height: 1 !important;

    color: #08a650 !important;
}

/* 4 - CONFIRMAR */
#pix-modal
.pix-premium__guide
.pay-guide__item:nth-child(4)
.pix-premium__guide-icon::before {
    content: "✓" !important;

    font-size: 28px !important;
    line-height: 1 !important;

    font-weight: 900 !important;

    color: #08a650 !important;
}

/* numero do passo */
#pix-modal .pay-guide__num {
    width: 26px !important;
    height: 26px !important;

    background:
        linear-gradient(
            135deg,
            #08ba58,
            #059347
        ) !important;

    box-shadow:
        0 4px 10px rgba(3, 150, 70, .18) !important;

    font-size: 11px !important;
    font-weight: 900 !important;
}

/* botão copiar */
#pix-modal .pix-premium__copy {
    position: relative !important;
}

#pix-modal .pix-premium__copy > span {
    font-size: 0 !important;
}

#pix-modal .pix-premium__copy > span::before {
    content: "⧉" !important;

    display: inline-block !important;

    font-size: 24px !important;
    line-height: 1 !important;

    color: #fff !important;
}

/* ícone do código ao lado do campo */
.pix-premium__copy-symbol {
    width: 34px !important;
    height: 34px !important;

    display: grid !important;
    place-items: center !important;

    border-radius: 9px !important;

    background: #f5f8fb !important;

    border: 1px solid #dfe7ef !important;

    font-size: 0 !important;
}

.pix-premium__copy-symbol::before {
    content: "⧉" !important;

    font-size: 21px !important;
    line-height: 1 !important;

    color: #496381 !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    #pix-modal .pix-premium__guide-icon {
        width: 38px !important;
        height: 38px !important;

        border-radius: 10px !important;
    }

    #pix-modal
    .pix-premium__guide
    .pay-guide__item:nth-child(1)
    .pix-premium__guide-icon::before {
        font-size: 22px !important;
    }

    #pix-modal
    .pix-premium__guide
    .pay-guide__item:nth-child(2)
    .pix-premium__guide-icon::before,
    #pix-modal
    .pix-premium__guide
    .pay-guide__item:nth-child(3)
    .pix-premium__guide-icon::before,
    #pix-modal
    .pix-premium__guide
    .pay-guide__item:nth-child(4)
    .pix-premium__guide-icon::before {
        font-size: 24px !important;
    }

    #pix-modal .pay-guide__num {
        width: 24px !important;
        height: 24px !important;

        font-size: 10px !important;
    }

    #pix-modal .pix-premium__copy > span::before {
        font-size: 21px !important;
    }

    .pix-premium__copy-symbol {
        width: 30px !important;
        height: 30px !important;
    }

    .pix-premium__copy-symbol::before {
        font-size: 18px !important;
    }
}



/* =========================================================
   PIX COPY FEEDBACK V1
   ========================================================= */

/* botão pequeno ao lado do código */

#pix-modal .pix-premium__copy-symbol {
    appearance: none !important;

    position: absolute !important;

    right: 10px !important;
    top: 50% !important;

    transform: translateY(-50%) !important;

    width: 38px !important;
    height: 38px !important;

    display: grid !important;
    place-items: center !important;

    padding: 0 !important;

    border: 1px solid #dbe5ed !important;
    border-radius: 10px !important;

    background: #ffffff !important;

    color: #46617f !important;

    cursor: pointer !important;

    box-shadow:
        0 3px 10px rgba(15, 41, 70, .06) !important;

    transition:
        transform .15s ease,
        background .15s ease,
        border-color .15s ease,
        color .15s ease !important;
}

#pix-modal .pix-premium__copy-symbol span {
    font-size: 21px !important;
    line-height: 1 !important;
}

#pix-modal .pix-premium__copy-symbol:hover {
    border-color: #9fdcba !important;

    color: #078343 !important;

    background: #f3fcf7 !important;
}

#pix-modal .pix-premium__copy-symbol:active {
    transform:
        translateY(-50%)
        scale(.92) !important;
}

#pix-modal
.pix-premium__copy-symbol.pix-copy-mini--success {
    background: #08a950 !important;

    border-color: #08a950 !important;

    color: #ffffff !important;
}

/* feedback do botão principal */

#pix-modal .pix-premium__copy.pix-copy--success {
    min-height: 68px !important;

    background:
        linear-gradient(
            135deg,
            #07994a,
            #067c3d
        ) !important;

    box-shadow:
        0 10px 26px rgba(0, 126, 59, .22) !important;
}

.pix-copy-feedback__check {
    width: 32px !important;
    height: 32px !important;

    flex: 0 0 32px !important;

    display: grid !important;
    place-items: center !important;

    border-radius: 50% !important;

    background: rgba(255,255,255,.18) !important;

    color: #fff !important;

    font-size: 19px !important;
    font-weight: 900 !important;
}

.pix-copy-feedback__content {
    display: flex !important;
    flex-direction: column !important;

    align-items: flex-start !important;

    gap: 2px !important;

    text-align: left !important;
}

.pix-copy-feedback__content strong {
    color: #ffffff !important;

    font-size: 15px !important;
    line-height: 1.1 !important;

    font-weight: 900 !important;
}

.pix-copy-feedback__content small {
    color: rgba(255,255,255,.90) !important;

    font-size: 10.5px !important;
    line-height: 1.25 !important;

    font-weight: 500 !important;
}

@media (max-width: 700px) {

    #pix-modal .pix-premium__copy-symbol {
        right: 8px !important;

        width: 34px !important;
        height: 34px !important;

        border-radius: 9px !important;
    }

    #pix-modal .pix-premium__copy-symbol span {
        font-size: 19px !important;
    }

    #pix-modal .pix-premium__copy.pix-copy--success {
        min-height: 62px !important;

        padding-left: 13px !important;
        padding-right: 13px !important;

        gap: 9px !important;
    }

    .pix-copy-feedback__check {
        width: 29px !important;
        height: 29px !important;

        flex-basis: 29px !important;

        font-size: 17px !important;
    }

    .pix-copy-feedback__content strong {
        font-size: 13px !important;
    }

    .pix-copy-feedback__content small {
        font-size: 9px !important;
    }
}



/* =========================================================
   PIX COPY CLEAN V2
   ========================================================= */

#pix-modal .pix-premium__copy.pix-copy--success-clean {
    min-height: 66px !important;

    padding: 10px 18px !important;

    background:
        linear-gradient(
            135deg,
            #07994a,
            #057b3c
        ) !important;

    box-shadow:
        0 10px 24px rgba(0, 126, 59, .22) !important;
}

.pix-copy-success-clean {
    display: flex !important;
    flex-direction: column !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 3px !important;

    width: 100% !important;
}

.pix-copy-success-clean strong {
    color: #fff !important;

    font-size: 15px !important;
    line-height: 1.1 !important;

    font-weight: 900 !important;
}

.pix-copy-success-clean small {
    max-width: 330px !important;

    color: rgba(255,255,255,.90) !important;

    font-size: 10px !important;
    line-height: 1.25 !important;

    font-weight: 500 !important;

    text-align: center !important;
}

/* botão pequeno */

#pix-modal
.pix-premium__copy-symbol.pix-copy-mini--success-clean {
    color: #fff !important;
    background: #079f4d !important;
    border-color: #079f4d !important;
}

#pix-modal
.pix-premium__copy-symbol.pix-copy-mini--success-clean span {
    color: #fff !important;

    font-size: 19px !important;
    font-weight: 900 !important;
}

/* =========================================================
   ICONES DOS PASSOS - CLEAN
   ========================================================= */

#pix-modal .pix-premium__guide-icon {
    width: 40px !important;
    height: 40px !important;

    display: grid !important;
    place-items: center !important;

    margin-top: 9px !important;

    border: 1px solid #cdebd9 !important;
    border-radius: 12px !important;

    background:
        linear-gradient(
            145deg,
            #f5fcf8,
            #edf9f2
        ) !important;

    color: #079f4d !important;

    box-shadow:
        0 4px 12px rgba(6, 130, 62, .06) !important;

    font-size: 0 !important;
}

#pix-modal
.pix-premium__guide
.pay-guide__item:nth-child(1)
.pix-premium__guide-icon::before {
    content: "▯" !important;

    font-size: 28px !important;
    line-height: 1 !important;

    color: #079f4d !important;
}

#pix-modal
.pix-premium__guide
.pay-guide__item:nth-child(2)
.pix-premium__guide-icon::before {
    content: "⌗" !important;

    font-size: 25px !important;
    line-height: 1 !important;

    color: #079f4d !important;
}

#pix-modal
.pix-premium__guide
.pay-guide__item:nth-child(3)
.pix-premium__guide-icon::before {
    content: "⧉" !important;

    font-size: 25px !important;
    line-height: 1 !important;

    color: #079f4d !important;
}

#pix-modal
.pix-premium__guide
.pay-guide__item:nth-child(4)
.pix-premium__guide-icon::before {
    content: "✓" !important;

    font-size: 28px !important;
    line-height: 1 !important;

    font-weight: 900 !important;

    color: #079f4d !important;
}

/* remove emoji / símbolo antigo de dentro */
#pix-modal .pix-premium__guide-icon {
    overflow: hidden !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    #pix-modal
    .pix-premium__copy.pix-copy--success-clean {
        min-height: 60px !important;

        padding: 8px 12px !important;
    }

    .pix-copy-success-clean strong {
        font-size: 13px !important;
    }

    .pix-copy-success-clean small {
        font-size: 8.5px !important;
    }

    #pix-modal .pix-premium__guide-icon {
        width: 36px !important;
        height: 36px !important;

        border-radius: 10px !important;
    }

    #pix-modal
    .pix-premium__guide
    .pay-guide__item:nth-child(1)
    .pix-premium__guide-icon::before {
        font-size: 25px !important;
    }

    #pix-modal
    .pix-premium__guide
    .pay-guide__item:nth-child(2)
    .pix-premium__guide-icon::before,
    #pix-modal
    .pix-premium__guide
    .pay-guide__item:nth-child(3)
    .pix-premium__guide-icon::before,
    #pix-modal
    .pix-premium__guide
    .pay-guide__item:nth-child(4)
    .pix-premium__guide-icon::before {
        font-size: 22px !important;
    }
}



/* =========================================================
   PIX ICONS PREMIUM FINAL
   ========================================================= */

/* remove caracteres antigos gerados por pseudo-elementos */

#pix-modal
.pix-premium__guide
.pay-guide__item
.pix-premium__guide-icon::before {
    content: none !important;
    display: none !important;
}

/* caixas dos icones */

#pix-modal .pix-premium__guide-icon {
    width: 44px !important;
    height: 44px !important;

    display: grid !important;
    place-items: center !important;

    margin: 10px auto 2px !important;

    padding: 9px !important;

    border: 1px solid #c9ebd7 !important;
    border-radius: 13px !important;

    background:
        linear-gradient(
            145deg,
            #f7fdfa,
            #ecfaf2
        ) !important;

    color: #079f4d !important;

    box-shadow:
        0 5px 14px rgba(6, 126, 61, .07) !important;

    box-sizing: border-box !important;
}

/* SVGs */

#pix-modal .pix-premium__guide-icon svg,
#pix-modal .pix-premium__copy-symbol svg,
#pix-modal .pix-premium__copy-main-icon svg {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    fill: none !important;

    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

/* =========================================================
   BOTAO PEQUENO
   ========================================================= */

#pix-modal .pix-premium__copy-symbol {
    width: 40px !important;
    height: 40px !important;

    padding: 9px !important;

    color: #416080 !important;

    background: #ffffff !important;

    border: 1px solid #dce5ed !important;
    border-radius: 11px !important;

    box-shadow:
        0 4px 12px rgba(12, 40, 70, .07) !important;
}

#pix-modal .pix-premium__copy-symbol::before {
    display: none !important;
    content: none !important;
}

#pix-modal
.pix-premium__copy-symbol.pix-copy-mini--copied {
    color: #ffffff !important;

    background:
        linear-gradient(
            135deg,
            #08b654,
            #078c43
        ) !important;

    border-color: transparent !important;
}

/* =========================================================
   BOTAO VERDE
   ========================================================= */

#pix-modal .pix-premium__copy {
    min-height: 58px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 11px !important;

    padding: 10px 18px !important;
}

#pix-modal .pix-premium__copy > span::before {
    content: none !important;
    display: none !important;
}

.pix-premium__copy-main-icon {
    width: 25px !important;
    height: 25px !important;

    flex: 0 0 25px !important;

    color: #ffffff !important;
}

.pix-premium__copy-main-label {
    color: #ffffff !important;

    font-size: 16px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
}

/* após copiar */

#pix-modal .pix-premium__copy.pix-copy--copied {
    min-height: 62px !important;

    background:
        linear-gradient(
            135deg,
            #078e45,
            #06783b
        ) !important;
}

.pix-copy-premium-success {
    display: flex !important;
    flex-direction: column !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 3px !important;

    width: 100% !important;
}

.pix-copy-premium-success strong {
    color: #ffffff !important;

    font-size: 15px !important;
    line-height: 1.1 !important;

    font-weight: 900 !important;
}

.pix-copy-premium-success small {
    color: rgba(255,255,255,.88) !important;

    font-size: 10px !important;
    line-height: 1.2 !important;

    font-weight: 500 !important;
}

/* =========================================================
   CARDS COMO PAGAR
   ========================================================= */

#pix-modal .pix-premium__guide .pay-guide__item {
    border-color: #deeee5 !important;

    background:
        linear-gradient(
            150deg,
            #f9fdfb,
            #f2faf6
        ) !important;

    box-shadow:
        0 5px 15px rgba(12, 57, 36, .035) !important;
}

#pix-modal .pay-guide__text strong {
    color: #10264a !important;
    font-weight: 850 !important;
}

#pix-modal .pay-guide__text span {
    color: #617594 !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    #pix-modal .pix-premium__guide-icon {
        width: 42px !important;
        height: 42px !important;

        padding: 9px !important;

        border-radius: 12px !important;
    }

    #pix-modal .pix-premium__copy-symbol {
        width: 38px !important;
        height: 38px !important;

        padding: 9px !important;
    }

    .pix-premium__copy-main-icon {
        width: 22px !important;
        height: 22px !important;

        flex-basis: 22px !important;
    }

    .pix-premium__copy-main-label {
        font-size: 15px !important;
    }

    #pix-modal .pix-premium__copy.pix-copy--copied {
        min-height: 58px !important;
    }

    .pix-copy-premium-success strong {
        font-size: 13px !important;
    }

    .pix-copy-premium-success small {
        font-size: 9px !important;
    }
}


/* =========================================================
   PIX COPY BUTTON V4 - TEXTO MAIS EXPLICATIVO
   ========================================================= */

#pix-modal .pix-premium__copy {
    min-height: 64px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 10px !important;

    padding: 10px 16px !important;
}

#pix-modal .pix-premium__copy-main-label {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    gap: 2px !important;

    text-align: left !important;

    font-size: 0 !important;
}

#pix-modal .pix-premium__copy-main-label::before {
    content: "Copiar código PIX" !important;

    color: #fff !important;

    font-size: 15px !important;
    line-height: 1.1 !important;

    font-weight: 900 !important;
}

#pix-modal .pix-premium__copy-main-label::after {
    content: "Toque aqui para copiar e pagar no app do seu banco" !important;

    color: rgba(255,255,255,.90) !important;

    font-size: 9.5px !important;
    line-height: 1.2 !important;

    font-weight: 500 !important;
}

@media (max-width: 700px) {

    #pix-modal .pix-premium__copy {
        min-height: 62px !important;

        padding: 9px 13px !important;
    }

    #pix-modal .pix-premium__copy-main-label::before {
        font-size: 14px !important;
    }

    #pix-modal .pix-premium__copy-main-label::after {
        font-size: 8.5px !important;
    }
}


/* =========================================================
   PROGRESS CARD V15 - REFERENCIA PREMIUM
   ========================================================= */

.progress-card.progress-card--premium {
    display: block !important;

    margin: 0 0 24px !important;

    padding: 20px 22px 0 !important;

    overflow: hidden !important;

    border: 1px solid #e4ebf1 !important;
    border-radius: 21px !important;

    background:
        linear-gradient(
            150deg,
            #ffffff 0%,
            #ffffff 65%,
            #f9fcfa 100%
        ) !important;

    box-shadow:
        0 10px 28px rgba(14, 42, 72, .075) !important;
}

/* =========================================================
   TOPO
   ========================================================= */

.progress-premium__top {
    display: flex !important;

    align-items: flex-start !important;
    justify-content: space-between !important;

    gap: 15px !important;

    margin-bottom: 15px !important;
}

.progress-premium__main {
    display: flex !important;
    align-items: center !important;

    gap: 13px !important;

    min-width: 0 !important;
}

/* icone */

.progress-premium__icon {
    width: 45px !important;
    height: 45px !important;

    flex: 0 0 45px !important;

    display: grid !important;
    place-items: center !important;

    border-radius: 50% !important;

    background:
        linear-gradient(
            145deg,
            #e9fbf1,
            #f4fcf7
        ) !important;

    color: #08aa52 !important;

    font-size: 23px !important;

    box-shadow:
        inset 0 0 0 1px rgba(9, 174, 83, .07) !important;
}

.progress-premium__values {
    min-width: 0 !important;
}

.progress-card--premium .progress-card__label {
    display: block !important;

    margin-bottom: 3px !important;

    color: #788aa5 !important;

    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 850 !important;

    letter-spacing: .04em !important;
}

/* valor arrecadado */

.progress-card--premium .progress-card__raised {
    display: block !important;

    margin: 0 0 3px !important;

    color: #08a84f !important;

    font-size: 31px !important;
    line-height: 1 !important;
    font-weight: 950 !important;

    letter-spacing: -.04em !important;
}

/* meta */

.progress-card--premium .progress-card__goal {
    display: block !important;

    color: #687c9a !important;

    font-size: 12px !important;
    line-height: 1.25 !important;
    font-weight: 500 !important;
}

.progress-card--premium .progress-card__goal strong {
    color: #11294e !important;

    font-weight: 850 !important;
}

/* percentual */

.progress-card--premium .progress-card__pct {
    flex: 0 0 auto !important;

    margin: 0 !important;

    padding: 8px 16px !important;

    border-radius: 999px !important;

    background:
        linear-gradient(
            145deg,
            #e8faef,
            #ddf7e8
        ) !important;

    border: 1px solid #caeed9 !important;

    color: #078d45 !important;

    font-size: 18px !important;
    line-height: 1 !important;
    font-weight: 950 !important;

    box-shadow:
        0 4px 12px rgba(7, 145, 69, .07) !important;
}

/* =========================================================
   BARRA
   ========================================================= */

.progress-card--premium .progress-card__track {
    width: 100% !important;
    height: 12px !important;

    margin: 0 0 0 !important;

    overflow: hidden !important;

    border-radius: 999px !important;

    background:
        linear-gradient(
            180deg,
            #e7edf2,
            #dfe7ed
        ) !important;

    box-shadow:
        inset 0 1px 2px rgba(16, 39, 66, .06) !important;
}

.progress-card--premium .progress-card__fill {
    min-width: 8px !important;
    height: 100% !important;

    border-radius: inherit !important;

    background:
        linear-gradient(
            90deg,
            #09c35d,
            #00a94f
        ) !important;

    box-shadow:
        0 0 12px rgba(0, 174, 80, .24) !important;
}

/* =========================================================
   RODAPE
   ========================================================= */

.progress-premium__footer {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr)
        !important;

    align-items: center !important;

    margin: 14px -22px 0 !important;
    padding: 12px 22px !important;

    border-top: 1px solid #edf1f4 !important;

    background:
        linear-gradient(
            90deg,
            #fbfefd,
            #f9fcfb
        ) !important;
}

.progress-premium__support,
.progress-premium__share {
    display: flex !important;
    align-items: center !important;

    gap: 8px !important;

    color: #536b8f !important;

    font-size: 12px !important;
    line-height: 1.2 !important;

    font-weight: 550 !important;
}

.progress-premium__share {
    justify-content: flex-end !important;
}

.progress-premium__people-icon,
.progress-premium__share-icon {
    color: #08a951 !important;

    font-size: 22px !important;
    line-height: 1 !important;

    font-weight: 800 !important;
}

.progress-premium__share-icon {
    color: #5c7295 !important;
}

.progress-premium__separator {
    width: 1px !important;
    height: 28px !important;

    margin: 0 18px !important;

    background: #e5eaef !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    .progress-card.progress-card--premium {
        margin-bottom: 18px !important;

        padding: 17px 17px 0 !important;

        border-radius: 18px !important;
    }

    .progress-premium__top {
        margin-bottom: 13px !important;
    }

    .progress-premium__main {
        gap: 10px !important;
    }

    .progress-premium__icon {
        width: 38px !important;
        height: 38px !important;

        flex-basis: 38px !important;

        font-size: 19px !important;
    }

    .progress-card--premium .progress-card__label {
        font-size: 8.5px !important;
    }

    .progress-card--premium .progress-card__raised {
        font-size: 27px !important;
    }

    .progress-card--premium .progress-card__goal {
        font-size: 10.5px !important;
    }

    .progress-card--premium .progress-card__pct {
        padding: 7px 12px !important;

        font-size: 15px !important;
    }

    .progress-card--premium .progress-card__track {
        height: 9px !important;
    }

    .progress-premium__footer {
        margin:
            12px -17px 0 !important;

        padding:
            10px 17px !important;
    }

    .progress-premium__support,
    .progress-premium__share {
        gap: 5px !important;

        font-size: 9.5px !important;
    }

    .progress-premium__people-icon,
    .progress-premium__share-icon {
        font-size: 18px !important;
    }

    .progress-premium__separator {
        height: 23px !important;

        margin: 0 9px !important;
    }
}

/* celulares pequenos */

@media (max-width: 380px) {

    .progress-card--premium .progress-card__raised {
        font-size: 25px !important;
    }

    .progress-card--premium .progress-card__pct {
        padding: 6px 10px !important;

        font-size: 14px !important;
    }

    .progress-premium__support,
    .progress-premium__share {
        font-size: 8.5px !important;
    }
}


/* Rodape informativo do card de arrecadacao */

.progress-premium__share--info {
    cursor: default !important;
    pointer-events: none !important;
}

.progress-premium__share--info,
.progress-premium__support {
    color: #5e7290 !important;
}

.progress-premium__share--info .progress-premium__share-icon,
.progress-premium__support .progress-premium__people-icon {
    opacity: .9 !important;
}


/* CTA V16 - borda laranja APC */
.dock__btn {
    border: 2px solid #f47b20 !important;
    box-shadow:
        0 5px 16px rgba(0, 169, 80, .20),
        0 0 0 1px rgba(244, 123, 32, .08) !important;
}


/* =========================================================
   EXIT DONATION V2 - DESIGN PREMIUM
   TESTE SOMENTE /luizgustavo
   ========================================================= */

#exit-donation-modal {
    padding: 16px !important;
}

#exit-donation-modal .exit-donation__panel {
    position: relative !important;

    width: min(560px, calc(100vw - 28px)) !important;
    max-height: calc(100dvh - 28px) !important;

    padding: 34px 30px 28px !important;

    border-radius: 28px !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #ffffff 78%,
            #f6fcf8 100%
        ) !important;

    border: 1px solid #e4ece7 !important;

    box-shadow:
        0 30px 80px rgba(7, 28, 52, .28) !important;

    overflow: hidden !important;
}

/* detalhe suave no rodape */
#exit-donation-modal .exit-donation__panel::after {
    content: "" !important;

    position: absolute !important;

    left: -8% !important;
    right: -8% !important;
    bottom: -70px !important;

    height: 150px !important;

    border-radius: 50% 50% 0 0 !important;

    background:
        linear-gradient(
            180deg,
            rgba(224, 248, 233, .48),
            rgba(238, 252, 244, .78)
        ) !important;

    z-index: 0 !important;

    pointer-events: none !important;
}

#exit-donation-modal .exit-donation__panel > * {
    position: relative !important;
    z-index: 2 !important;
}

/* fechar */

#exit-donation-modal .modal__close {
    top: 18px !important;
    right: 18px !important;

    width: 42px !important;
    height: 42px !important;

    border-radius: 50% !important;

    background: #fff !important;

    border: 1px solid #e7edf1 !important;

    color: #17273f !important;

    font-size: 26px !important;

    box-shadow:
        0 7px 20px rgba(12, 35, 59, .09) !important;
}

/* cabecalho */

#exit-donation-modal .exit-donation__head {
    padding: 0 20px !important;

    text-align: center !important;
}

/* coracao */

#exit-donation-modal .exit-donation__heart {
    position: relative !important;

    width: 88px !important;
    height: 72px !important;

    display: grid !important;
    place-items: center !important;

    margin: 0 auto 18px !important;

    font-size: 54px !important;
    line-height: 1 !important;

    filter:
        drop-shadow(0 8px 12px rgba(233, 32, 88, .16))
        !important;
}

#exit-donation-modal .exit-donation__heart::before,
#exit-donation-modal .exit-donation__heart::after {
    content: "" !important;

    position: absolute !important;

    width: 20px !important;
    height: 5px !important;

    border-radius: 999px !important;

    background: #55d98b !important;
}

#exit-donation-modal .exit-donation__heart::before {
    left: -2px !important;
    top: 18px !important;

    transform: rotate(36deg) !important;

    box-shadow:
        4px 18px 0 #55d98b !important;
}

#exit-donation-modal .exit-donation__heart::after {
    right: -2px !important;
    top: 18px !important;

    transform: rotate(-36deg) !important;

    box-shadow:
        -4px 18px 0 #55d98b !important;
}

/* titulo */

#exit-donation-title {
    margin: 0 0 10px !important;

    color: #071d46 !important;

    font-size: 34px !important;
    line-height: 1 !important;

    font-weight: 950 !important;

    letter-spacing: -.04em !important;
}

/* subtitulo */

#exit-donation-modal .modal__lead {
    max-width: 390px !important;

    margin: 0 auto 24px !important;

    color: #5f7290 !important;

    font-size: 16px !important;
    line-height: 1.45 !important;

    font-weight: 500 !important;
}

/* =========================================================
   CARDS DOS VALORES
   ========================================================= */

#exit-donation-modal .exit-donation__values {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr))
        !important;

    gap: 16px !important;

    margin: 0 0 21px !important;
}

#exit-donation-modal .exit-donation__value {
    position: relative !important;

    min-height: 150px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 8px !important;

    padding: 18px 14px 20px !important;

    border-radius: 22px !important;

    border: 1.5px solid #b9e8cb !important;

    background:
        linear-gradient(
            145deg,
            #fbfffc,
            #f2fcf6
        ) !important;

    color: #12304e !important;

    box-shadow:
        0 8px 20px rgba(7, 104, 52, .055) !important;

    transition:
        transform .15s ease,
        border-color .15s ease,
        box-shadow .15s ease
        !important;
}

#exit-donation-modal .exit-donation__value:hover {
    transform: translateY(-2px) !important;

    border-color: #72d89a !important;

    box-shadow:
        0 12px 26px rgba(7, 104, 52, .10) !important;
}

#exit-donation-modal .exit-donation__value:active {
    transform: scale(.985) !important;
}

/* icone */

#exit-donation-modal .exit-donation__value::before {
    content: "♡" !important;

    display: block !important;

    color: #078946 !important;

    font-size: 42px !important;
    line-height: .8 !important;

    font-weight: 400 !important;

    margin-bottom: 2px !important;
}

#exit-donation-modal
.exit-donation__value:nth-child(2)::before {
    content: "♡" !important;

    font-size: 46px !important;
}

/* texto "Quero ajudar com" */

#exit-donation-modal .exit-donation__value span {
    margin: 0 !important;

    color: #19314e !important;

    font-size: 15px !important;
    line-height: 1.2 !important;

    font-weight: 500 !important;
}

/* valor */

#exit-donation-modal .exit-donation__value strong {
    color: #07853f !important;

    font-size: 31px !important;
    line-height: 1 !important;

    font-weight: 950 !important;

    letter-spacing: -.03em !important;
}

/* legenda inferior nos cards */

#exit-donation-modal .exit-donation__value::after {
    display: block !important;

    margin-top: 4px !important;

    padding: 6px 14px !important;

    border-radius: 999px !important;

    background: #e2f8ea !important;

    color: #24513a !important;

    font-size: 12px !important;
    line-height: 1 !important;

    font-weight: 650 !important;
}

#exit-donation-modal
.exit-donation__value:nth-child(1)::after {
    content: "Já faz a diferença  ♥" !important;
}

#exit-donation-modal
.exit-donation__value:nth-child(2)::after {
    content: "Ajuda ainda mais  ♡" !important;
}

/* agora nao */

#exit-donation-modal .exit-donation__leave {
    display: block !important;

    margin: 0 auto 15px !important;

    padding: 8px 12px !important;

    border: 0 !important;

    background: transparent !important;

    color: #314966 !important;

    font-size: 15px !important;
    line-height: 1 !important;

    text-decoration: underline !important;

    text-underline-offset: 3px !important;

    cursor: pointer !important;
}

/* rodape seguro */

#exit-donation-modal .modal__foot {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 8px !important;

    margin: 0 !important;

    color: #536c8c !important;

    font-size: 13px !important;

    font-weight: 550 !important;
}

#exit-donation-modal .modal__foot::before {
    content: "✓" !important;

    width: 30px !important;
    height: 30px !important;

    display: grid !important;
    place-items: center !important;

    border: 2px solid #079c4a !important;
    border-radius: 9px !important;

    color: #079c4a !important;

    font-size: 15px !important;
    font-weight: 900 !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    #exit-donation-modal {
        padding: 10px !important;
    }

    #exit-donation-modal .exit-donation__panel {
        width: calc(100vw - 20px) !important;
        max-height: calc(100dvh - 20px) !important;

        padding: 24px 18px 20px !important;

        border-radius: 22px !important;
    }

    #exit-donation-modal .modal__close {
        top: 13px !important;
        right: 13px !important;

        width: 37px !important;
        height: 37px !important;

        font-size: 22px !important;
    }

    #exit-donation-modal .exit-donation__heart {
        width: 65px !important;
        height: 54px !important;

        margin-bottom: 12px !important;

        font-size: 42px !important;
    }

    #exit-donation-modal
    .exit-donation__heart::before,
    #exit-donation-modal
    .exit-donation__heart::after {
        width: 14px !important;
        height: 4px !important;
    }

    #exit-donation-title {
        font-size: 29px !important;
        line-height: 1.02 !important;
    }

    #exit-donation-modal .modal__lead {
        max-width: 330px !important;

        margin-bottom: 18px !important;

        font-size: 13.5px !important;
        line-height: 1.4 !important;
    }

    #exit-donation-modal .exit-donation__values {
        gap: 10px !important;

        margin-bottom: 16px !important;
    }

    #exit-donation-modal .exit-donation__value {
        min-height: 124px !important;

        padding: 14px 8px 15px !important;

        border-radius: 17px !important;
    }

    #exit-donation-modal .exit-donation__value::before {
        font-size: 32px !important;
    }

    #exit-donation-modal
    .exit-donation__value:nth-child(2)::before {
        font-size: 35px !important;
    }

    #exit-donation-modal .exit-donation__value span {
        font-size: 11px !important;
    }

    #exit-donation-modal .exit-donation__value strong {
        font-size: 24px !important;
    }

    #exit-donation-modal .exit-donation__value::after {
        padding: 5px 8px !important;

        font-size: 8.5px !important;
    }

    #exit-donation-modal .exit-donation__leave {
        margin-bottom: 12px !important;

        font-size: 13px !important;
    }

    #exit-donation-modal .modal__foot {
        font-size: 11px !important;
    }

    #exit-donation-modal .modal__foot::before {
        width: 25px !important;
        height: 25px !important;

        border-radius: 7px !important;

        font-size: 12px !important;
    }
}


/* =========================================================
   EXIT DONATION V3 - DESTAQUE NOS VALORES
   ========================================================= */

#exit-donation-modal .exit-donation__value {
    position: relative !important;

    cursor: pointer !important;

    border: 2px solid #8fdcaf !important;

    background:
        linear-gradient(
            145deg,
            #f5fff8,
            #eaf9ef
        ) !important;

    box-shadow:
        0 8px 20px rgba(5, 128, 61, .08) !important;

    transition:
        transform .15s ease,
        box-shadow .15s ease,
        border-color .15s ease,
        background .15s ease
        !important;
}

/* faixa: TOQUE PARA ESCOLHER */

#exit-donation-modal .exit-donation__value span::before {
    content: "TOQUE PARA ESCOLHER" !important;

    display: block !important;

    margin: 0 auto 7px !important;

    padding: 4px 8px !important;

    width: max-content !important;

    max-width: 100% !important;

    border-radius: 999px !important;

    background: #dff7e7 !important;

    color: #08723c !important;

    font-size: 9px !important;
    line-height: 1 !important;
    font-weight: 900 !important;

    letter-spacing: .04em !important;
}

/* texto superior */

#exit-donation-modal .exit-donation__value span {
    color: #18314e !important;

    font-weight: 650 !important;
}

/* valor com mais destaque */

#exit-donation-modal .exit-donation__value strong {
    color: #067d3d !important;

    font-size: 34px !important;
    line-height: 1 !important;

    font-weight: 950 !important;

    text-shadow:
        0 1px 0 rgba(255,255,255,.7) !important;
}

/* R$25 com destaque extra, sem pre-selecionar */

#exit-donation-modal
.exit-donation__value:nth-child(2) {
    border-color: #43c978 !important;

    background:
        linear-gradient(
            145deg,
            #f0fff5,
            #e2f8e9
        ) !important;

    box-shadow:
        0 10px 24px rgba(4, 144, 65, .13) !important;
}

#exit-donation-modal
.exit-donation__value:nth-child(2)::before {
    transform: scale(1.06) !important;
}

/* selo opcao mais escolhida */

#exit-donation-modal
.exit-donation__value:nth-child(2) {
    padding-top: 24px !important;
}

#exit-donation-modal
.exit-donation__value:nth-child(2) > strong::after {
    content: "  MAIS ESCOLHIDO" !important;

    display: block !important;

    margin: 8px auto 0 !important;

    width: max-content !important;

    padding: 4px 9px !important;

    border-radius: 999px !important;

    background: #0aaa52 !important;

    color: #ffffff !important;

    font-size: 8px !important;
    line-height: 1 !important;

    font-weight: 900 !important;
    letter-spacing: .04em !important;
}

/* hover / toque */

#exit-donation-modal .exit-donation__value:hover {
    transform: translateY(-3px) scale(1.015) !important;

    border-color: #34bf6e !important;

    box-shadow:
        0 13px 30px rgba(4, 128, 59, .15) !important;
}

#exit-donation-modal .exit-donation__value:active {
    transform: scale(.97) !important;

    background:
        linear-gradient(
            145deg,
            #e4f9eb,
            #d8f3e2
        ) !important;
}

/* leve pulso no R$25 */

@keyframes exitOptionPulse {
    0%,
    100% {
        box-shadow:
            0 10px 24px rgba(4, 144, 65, .13);
    }

    50% {
        box-shadow:
            0 12px 30px rgba(4, 160, 74, .22);
    }
}

#exit-donation-modal
.exit-donation__value:nth-child(2) {
    animation:
        exitOptionPulse 2.8s ease-in-out infinite !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    #exit-donation-modal .exit-donation__value {
        min-height: 138px !important;
    }

    #exit-donation-modal .exit-donation__value span::before {
        margin-bottom: 6px !important;

        padding: 3px 6px !important;

        font-size: 7px !important;
    }

    #exit-donation-modal .exit-donation__value strong {
        font-size: 28px !important;
    }

    #exit-donation-modal
    .exit-donation__value:nth-child(2)
    > strong::after {
        margin-top: 6px !important;

        padding: 3px 6px !important;

        font-size: 6.8px !important;
    }
}


/* =========================================================
   MODAL DOACAO - 6 OPCOES
   30 / 50 / 100 / 200 / 500 / 1000
   ========================================================= */

/*
Ordem atual:
1  = 30
2  = 35
3  = 40
4  = 45
5  = 50
6  = 60
7  = 75
8  = 100
9  = 200
10 = 300
11 = 400
12 = 500
13 = 750
14 = 1000
*/

/* Esconde valores que nao queremos mostrar */
#donation-modal .donation-premium__grid .pick-grid__item:nth-child(2),
#donation-modal .donation-premium__grid .pick-grid__item:nth-child(3),
#donation-modal .donation-premium__grid .pick-grid__item:nth-child(4),
#donation-modal .donation-premium__grid .pick-grid__item:nth-child(6),
#donation-modal .donation-premium__grid .pick-grid__item:nth-child(7),
#donation-modal .donation-premium__grid .pick-grid__item:nth-child(10),
#donation-modal .donation-premium__grid .pick-grid__item:nth-child(11),
#donation-modal .donation-premium__grid .pick-grid__item:nth-child(13) {
    display: none !important;
}

/* 6 opcoes = 3 colunas x 2 linhas */
#donation-modal .donation-premium__grid {
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 10px !important;
}

/* Nenhum item ocupa duas colunas */
#donation-modal
.donation-premium__grid
.pick-grid__item:last-child {
    grid-column: auto !important;
}

/* Cards maiores agora que existem menos opcoes */
#donation-modal
.donation-premium__grid
.pick-btn--grid {
    min-height: 82px !important;
    height: 82px !important;

    border-radius: 15px !important;

    font-size: 19px !important;
}

/* ---------------------------------------------------------
   Remove visual antigo de "Mais doado" do R$50
   --------------------------------------------------------- */

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(5)
.pick-btn--grid::before {
    display: none !important;
}

/* ---------------------------------------------------------
   R$100 = MAIS DOADO
   --------------------------------------------------------- */

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(8) {
    position: relative !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(8)::before {
    content: "Mais doado" !important;

    position: absolute !important;

    z-index: 10 !important;

    top: -7px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    padding: 4px 9px !important;

    border-radius: 999px !important;

    background: #08a950 !important;
    color: #ffffff !important;

    font-size: 9px !important;
    line-height: 1 !important;

    font-weight: 900 !important;

    white-space: nowrap !important;

    box-shadow:
        0 4px 9px rgba(0, 140, 65, .18) !important;
}

/* Pequeno destaque no R$100 */
#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(8)
.pick-btn--grid {
    border: 2px solid #49c77d !important;

    background:
        linear-gradient(
            145deg,
            #f4fff8,
            #eaf9f0
        ) !important;

    box-shadow:
        0 8px 20px rgba(7, 150, 70, .10) !important;
}

/* =========================================================
   LEGENDAS
   ========================================================= */

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(1)
.pick-btn--grid::after {
    content: "Já ajuda muito" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(5)
.pick-btn--grid::after {
    content: "Faz a diferença" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(8)
.pick-btn--grid::after {
    content: "O mais escolhido" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(9)
.pick-btn--grid::after {
    content: "Ajuda ainda mais" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(12)
.pick-btn--grid::after {
    content: "Grande apoio" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(14)
.pick-btn--grid::after {
    content: "Faz grande impacto" !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

    #donation-modal .donation-premium__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 8px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        min-height: 76px !important;
        height: 76px !important;

        padding:
            9px 3px 20px !important;

        font-size: 17px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-grid__item:nth-child(8)::before {
        top: -6px !important;

        padding: 3px 7px !important;

        font-size: 7.5px !important;
    }
}


/* =========================================================
   DONATION VALUES V4
   ACESSIBILIDADE + REMOVE SELO ANTIGO R$50
   ========================================================= */

/* ---------------------------------------------------------
   R$50 - REMOVE DEFINITIVAMENTE O "MAIS DOADO" ANTIGO
   --------------------------------------------------------- */

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(5)::before,

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(5)
.pick-btn--grid::before,

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(5)
button::before,

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(5)
a::before {
    content: none !important;
    display: none !important;
}

/* ---------------------------------------------------------
   CARDS MAIORES
   --------------------------------------------------------- */

#donation-modal .donation-premium__grid {
    gap: 12px !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item {
    min-width: 0 !important;
}

#donation-modal
.donation-premium__grid
.pick-btn--grid {
    width: 100% !important;

    min-height: 105px !important;
    height: 105px !important;

    padding: 18px 7px 25px !important;

    border-radius: 18px !important;

    border-width: 1.5px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    font-size: 22px !important;
    line-height: 1.05 !important;

    font-weight: 900 !important;

    cursor: pointer !important;

    box-shadow:
        0 6px 16px rgba(11, 39, 71, .07) !important;
}

/* valor mais legivel */

#donation-modal
.donation-premium__grid
.pick-btn--grid {
    color: #087d3d !important;
}

/* legenda maior */

#donation-modal
.donation-premium__grid
.pick-btn--grid::after {
    bottom: 10px !important;

    font-size: 10px !important;
    line-height: 1.15 !important;

    font-weight: 600 !important;

    color: #59708f !important;
}

/* ---------------------------------------------------------
   R$100 - UNICO MAIS DOADO
   --------------------------------------------------------- */

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(8)::before {
    content: "Mais doado" !important;

    display: block !important;

    position: absolute !important;

    top: -9px !important;
    left: 50% !important;

    z-index: 20 !important;

    transform: translateX(-50%) !important;

    padding: 5px 11px !important;

    border-radius: 999px !important;

    background: #079d4b !important;
    color: #fff !important;

    font-size: 10px !important;
    line-height: 1 !important;

    font-weight: 900 !important;

    white-space: nowrap !important;

    box-shadow:
        0 5px 12px rgba(5, 145, 67, .22) !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(8)
.pick-btn--grid {
    border: 2px solid #22b963 !important;

    background:
        linear-gradient(
            145deg,
            #f5fff8,
            #e9f9ef
        ) !important;

    box-shadow:
        0 8px 22px rgba(5, 151, 67, .13) !important;
}

/* feedback de clique */

#donation-modal
.donation-premium__grid
.pick-btn--grid:active {
    transform: scale(.97) !important;
}

/* =========================================================
   MOBILE - PUBLICO COM LEITURA MAIS FACIL
   ========================================================= */

@media (max-width: 700px) {

    #donation-modal .donation-premium__grid {
        gap: 10px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        min-height: 96px !important;
        height: 96px !important;

        padding: 16px 4px 25px !important;

        border-radius: 16px !important;

        font-size: 20px !important;
        line-height: 1 !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid::after {
        bottom: 9px !important;

        font-size: 9px !important;
        line-height: 1.1 !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-grid__item:nth-child(8)::before {
        top: -8px !important;

        padding: 4px 9px !important;

        font-size: 9px !important;
    }
}

/* telas pequenas continuam legiveis */

@media (max-width: 380px) {

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        min-height: 91px !important;
        height: 91px !important;

        font-size: 18px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid::after {
        font-size: 8px !important;
    }
}


/* =========================================================
   DONATION BUTTON DEPTH V5
   MAIS CARA DE BOTAO / MELHOR LEITURA
   ========================================================= */

#donation-modal
.donation-premium__grid
.pick-btn--grid {
    border: 1.5px solid #cfd8e2 !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfcfd 100%
        ) !important;

    box-shadow:
        inset 0 -4px 7px rgba(15, 31, 48, .08),
        inset 0 1px 0 rgba(255,255,255,.95),
        0 7px 14px rgba(8, 28, 49, .10) !important;

    transition:
        transform .14s ease,
        box-shadow .14s ease,
        border-color .14s ease,
        background .14s ease !important;
}

/* hover */
#donation-modal
.donation-premium__grid
.pick-btn--grid:hover {
    transform: translateY(-2px) !important;

    border-color: #aebdca !important;

    box-shadow:
        inset 0 -4px 7px rgba(15, 31, 48, .09),
        inset 0 1px 0 rgba(255,255,255,.95),
        0 10px 18px rgba(8, 28, 49, .14) !important;
}

/* toque/click = afunda */
#donation-modal
.donation-premium__grid
.pick-btn--grid:active {
    transform: translateY(1px) scale(.985) !important;

    box-shadow:
        inset 0 3px 8px rgba(8, 28, 49, .16),
        inset 0 -1px 0 rgba(255,255,255,.75),
        0 2px 6px rgba(8, 28, 49, .08) !important;
}

/* deixa o valor mais forte */
#donation-modal
.donation-premium__grid
.pick-btn--grid {
    font-weight: 950 !important;
}

/* R$100 continua especial */
#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(8)
.pick-btn--grid {
    border: 2px solid #16b85d !important;

    background:
        linear-gradient(
            180deg,
            #f5fff8 0%,
            #e9f8ef 100%
        ) !important;

    box-shadow:
        inset 0 -4px 7px rgba(0, 116, 52, .08),
        inset 0 1px 0 rgba(255,255,255,.95),
        0 8px 18px rgba(0, 151, 68, .16) !important;
}

/* mobile */
@media (max-width: 700px) {

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        box-shadow:
            inset 0 -4px 6px rgba(15, 31, 48, .09),
            inset 0 1px 0 rgba(255,255,255,.95),
            0 6px 12px rgba(8, 28, 49, .11) !important;
    }
}


/* =========================================================
   DONATION CARDS V6
   CONTORNO VERDE + SOMBRA + INSTRUCAO
   ========================================================= */

/* instrucao acima dos cards */
#donation-modal .donation-premium__grid::before {
    content: "Selecione o valor que deseja fazer sua doação ↓" !important;

    grid-column: 1 / -1 !important;

    display: block !important;

    margin: 0 0 6px !important;

    padding: 10px 14px !important;

    border-radius: 12px !important;

    background: #eefaf3 !important;

    border: 1px solid #bfe8cf !important;

    color: #0b7f42 !important;

    font-size: 14px !important;
    line-height: 1.25 !important;

    font-weight: 900 !important;

    text-align: center !important;

    box-shadow:
        0 4px 10px rgba(6, 111, 52, .06) !important;
}

/* todos os cards com borda verde */
#donation-modal
.donation-premium__grid
.pick-btn--grid {
    border: 2px solid #7fd6a2 !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfefc 100%
        ) !important;

    box-shadow:
        inset 0 -4px 7px rgba(12, 31, 45, .09),
        inset 0 1px 0 rgba(255,255,255,.96),
        0 7px 14px rgba(6, 32, 48, .12) !important;
}

/* garante o efeito também no R$30 */
#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(1)
.pick-btn--grid {
    border: 2px solid #7fd6a2 !important;

    box-shadow:
        inset 0 -4px 7px rgba(12, 31, 45, .09),
        inset 0 1px 0 rgba(255,255,255,.96),
        0 7px 14px rgba(6, 32, 48, .12) !important;
}

/* hover */
#donation-modal
.donation-premium__grid
.pick-btn--grid:hover {
    border-color: #43c77a !important;

    transform: translateY(-2px) !important;

    box-shadow:
        inset 0 -4px 7px rgba(12, 31, 45, .10),
        inset 0 1px 0 rgba(255,255,255,.96),
        0 10px 18px rgba(6, 32, 48, .15) !important;
}

/* clique */
#donation-modal
.donation-premium__grid
.pick-btn--grid:active {
    transform: translateY(1px) scale(.985) !important;

    box-shadow:
        inset 0 3px 8px rgba(9, 34, 48, .18),
        0 2px 5px rgba(6, 32, 48, .08) !important;
}

/* R$100 = destaque mais forte */
#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(8)
.pick-btn--grid {
    border: 2.5px solid #08aa52 !important;

    background:
        linear-gradient(
            180deg,
            #f4fff8 0%,
            #eaf9ef 100%
        ) !important;

    box-shadow:
        inset 0 -4px 7px rgba(0, 112, 50, .08),
        inset 0 1px 0 rgba(255,255,255,.96),
        0 9px 19px rgba(0, 151, 68, .18) !important;
}

/* mobile */
@media (max-width: 700px) {

    #donation-modal .donation-premium__grid::before {
        margin-bottom: 5px !important;

        padding: 9px 10px !important;

        font-size: 12px !important;
        line-height: 1.25 !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-btn--grid {
        border-width: 1.8px !important;

        box-shadow:
            inset 0 -4px 6px rgba(12, 31, 45, .10),
            inset 0 1px 0 rgba(255,255,255,.96),
            0 6px 12px rgba(6, 32, 48, .12) !important;
    }
}

/* =========================================================
   LIVE DONATION POPUP V4
   TOAST PEQUENO NO TOPO DIREITO
   ========================================================= */

#realDonationPopup,
#realDonationPopup.show {
    position: fixed !important;

    inset: auto !important;

    top: 20px !important;
    right: 18px !important;
    left: auto !important;
    bottom: auto !important;

    width: 185px !important;
    max-width: calc(100vw - 90px) !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 8px 10px !important;

    border-radius: 13px !important;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.98),
            rgba(247,255,250,.98)
        ) !important;

    border: 1px solid rgba(54, 194, 111, .30) !important;

    box-shadow:
        0 7px 18px rgba(7, 32, 45, .11) !important;

    z-index: 999999 !important;

    overflow: visible !important;

    box-sizing: border-box !important;
}

/* fechado */
#realDonationPopup:not(.show) {
    opacity: 0 !important;
    visibility: hidden !important;

    transform:
        translateY(-7px)
        scale(.97)
        !important;

    pointer-events: none !important;
}

/* aberto */
#realDonationPopup.show {
    opacity: 1 !important;
    visibility: visible !important;

    transform:
        translateY(0)
        scale(1)
        !important;

    pointer-events: auto !important;
}

/* conteudo interno */
#realDonationPopup .live-popup__wrap {
    display: grid !important;

    grid-template-columns: 34px 1fr !important;

    gap: 7px !important;

    align-items: center !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* coração compacto */
#realDonationPopup .live-popup__heart {
    width: 34px !important;
    height: 34px !important;

    min-width: 34px !important;
    min-height: 34px !important;

    display: grid !important;
    place-items: center !important;

    border-radius: 50% !important;

    background: #fff0f3 !important;

    font-size: 19px !important;
    line-height: 1 !important;

    box-shadow:
        0 3px 8px rgba(230, 53, 88, .10) !important;
}

/* texto */
#realDonationPopup .live-popup__text {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #0a2144 !important;

    font-size: 10px !important;
    line-height: 1.22 !important;

    font-weight: 800 !important;

    letter-spacing: 0 !important;
}

/* valor */
#realDonationPopup .live-popup__amount {
    display: block !important;

    width: max-content !important;

    margin-top: 2px !important;

    padding: 2px 5px !important;

    border-radius: 6px !important;

    background: #e7f9ed !important;

    color: #07823e !important;

    font-size: 13px !important;
    line-height: 1.1 !important;

    font-weight: 950 !important;
}

/* sem pseudo-elementos grandes */
#realDonationPopup::before,
#realDonationPopup::after {
    display: none !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    #realDonationPopup,
    #realDonationPopup.show {
        top: 18px !important;
        right: 58px !important;

        width: 170px !important;
        max-width: calc(100vw - 95px) !important;

        padding: 7px 9px !important;

        border-radius: 12px !important;
    }

    #realDonationPopup .live-popup__wrap {
        grid-template-columns: 31px 1fr !important;

        gap: 6px !important;
    }

    #realDonationPopup .live-popup__heart {
        width: 31px !important;
        height: 31px !important;

        min-width: 31px !important;
        min-height: 31px !important;

        font-size: 17px !important;
    }

    #realDonationPopup .live-popup__text {
        font-size: 9.5px !important;
        line-height: 1.18 !important;
    }

    #realDonationPopup .live-popup__amount {
        margin-top: 2px !important;

        padding: 2px 5px !important;

        font-size: 12.5px !important;
    }
}


/* =========================================================
   LIVE DONATION POPUP V5
   AJUSTE FINO DO ICONE / TRACOS DENTRO DO CARD
   ========================================================= */

/* garante que nada visual escape do popup */
#realDonationPopup,
#realDonationPopup.show {
    overflow: hidden !important;
}

/* area do coracao mais controlada */
#realDonationPopup .live-popup__heart {
    position: relative !important;

    width: 32px !important;
    height: 32px !important;

    min-width: 32px !important;
    min-height: 32px !important;

    overflow: visible !important;

    font-size: 17px !important;
}

/* remove os tracados antigos herdados */
#realDonationPopup .live-popup__heart::before,
#realDonationPopup .live-popup__heart::after {
    box-shadow: none !important;

    width: 9px !important;
    height: 3px !important;

    border-radius: 999px !important;

    background: #19bd63 !important;
}

/* tracos do lado esquerdo/direito, agora internos */
#realDonationPopup .live-popup__heart::before {
    left: -2px !important;
    right: auto !important;

    top: 5px !important;

    transform: rotate(38deg) !important;

    box-shadow:
        2px 10px 0 #19bd63 !important;
}

#realDonationPopup .live-popup__heart::after {
    right: -2px !important;
    left: auto !important;

    top: 5px !important;

    transform: rotate(-38deg) !important;

    box-shadow:
        -2px 10px 0 #19bd63 !important;
}

/* da um pouco mais de espaco entre icone e texto */
#realDonationPopup .live-popup__wrap {
    grid-template-columns: 36px 1fr !important;
    gap: 7px !important;
}

/* evita que texto encoste demais */
#realDonationPopup .live-popup__text {
    min-width: 0 !important;
}

/* mobile */
@media (max-width: 600px) {

    #realDonationPopup .live-popup__heart {
        width: 30px !important;
        height: 30px !important;

        min-width: 30px !important;
        min-height: 30px !important;

        font-size: 16px !important;
    }

    #realDonationPopup .live-popup__wrap {
        grid-template-columns: 34px 1fr !important;
        gap: 6px !important;
    }

    #realDonationPopup .live-popup__heart::before,
    #realDonationPopup .live-popup__heart::after {
        width: 8px !important;
        height: 3px !important;
    }

    #realDonationPopup .live-popup__heart::before {
        left: -1px !important;
        top: 5px !important;

        box-shadow:
            2px 9px 0 #19bd63 !important;
    }

    #realDonationPopup .live-popup__heart::after {
        right: -1px !important;
        top: 5px !important;

        box-shadow:
            -2px 9px 0 #19bd63 !important;
    }
}


/* =========================================================
   GLOBAL MODAL 9 TICKETS V1
   30 / 50 / 100 / 200 / 300 / 400 / 500 / 700 / 1000
   ========================================================= */

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    grid-column: auto !important;
    width: 100% !important;
    min-width: 0 !important;
}

#donation-modal .donation-premium__grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
.pick-btn--grid {
    width: 100% !important;
    min-height: 90px !important;
}

/* Remove destaques antigos baseados em posição */
#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)::before {
    content: none !important;
    display: none !important;
}

#donation-modal
.donation-premium__grid
.pick-btn__tag {
    display: none !important;
}

/* R$100 = único Mais doado */
#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n):has([data-amount-cents="10000"]) {
    position: relative !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n):has([data-amount-cents="10000"])::before {
    content: "Mais doado" !important;
    display: block !important;

    position: absolute !important;
    top: -8px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    z-index: 50 !important;

    padding: 4px 9px !important;
    border-radius: 999px !important;

    background: #079d4b !important;
    color: #fff !important;

    font-size: 9px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n):has([data-amount-cents="10000"])
.pick-btn--grid {
    border: 2.5px solid #08aa52 !important;

    background:
        linear-gradient(
            180deg,
            #f4fff8,
            #eaf9ef
        ) !important;

    box-shadow:
        inset 0 -4px 7px rgba(0,112,50,.08),
        0 9px 19px rgba(0,151,68,.18) !important;
}

/* R$700 = card normal */
#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n):has([data-amount-cents="70000"])
.pick-btn--grid {
    border: 1.5px solid #75dca1 !important;
    background: #fff !important;

    box-shadow:
        inset 0 -4px 7px rgba(0,0,0,.045),
        0 8px 16px rgba(10,40,70,.11) !important;

    transform: none !important;
}

/* =========================================================
   LEGENDAS POR VALOR
   ========================================================= */

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
[data-amount-cents="3000"]::after {
    content: "Já ajuda muito" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
[data-amount-cents="5000"]::after {
    content: "Faz a diferença" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
[data-amount-cents="10000"]::after {
    content: "O mais escolhido" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
[data-amount-cents="20000"]::after {
    content: "Ajuda ainda mais" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
[data-amount-cents="30000"]::after {
    content: "Mais esperança" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
[data-amount-cents="40000"]::after {
    content: "Fortalece a corrente" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
[data-amount-cents="50000"]::after {
    content: "Grande apoio" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
[data-amount-cents="70000"]::after {
    content: "Ajuda especial" !important;
}

#donation-modal
.donation-premium__grid
.pick-grid__item:nth-child(n)
[data-amount-cents="100000"]::after {
    content: "Grande impacto" !important;
}

@media (max-width: 600px) {

    #donation-modal .donation-premium__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;
        gap: 9px !important;
    }

    #donation-modal
    .donation-premium__grid
    .pick-grid__item:nth-child(n)
    .pick-btn--grid {
        min-height: 88px !important;
    }
}

/* AJUDE O BRYAN - CTA FIXO AZUL V2 */

.dock__btn {
    background: linear-gradient(
        135deg,
        #129fe8 0%,
        #0877d1 100%
    ) !important;

    border: 2px solid #0b67b8 !important;

    color: #ffffff !important;

    box-shadow:
        0 6px 18px rgba(8, 119, 209, .28),
        0 0 0 1px rgba(18, 159, 232, .08) !important;
}

.dock__btn:hover,
.dock__btn:focus,
.dock__btn:active {
    background: linear-gradient(
        135deg,
        #0d8fd5 0%,
        #0668ba 100%
    ) !important;

    border-color: #085da7 !important;

    color: #ffffff !important;
}

.dock__btn .dock__icon {
    background: rgba(255,255,255,.18) !important;
    color: #ffffff !important;
}

.dock__btn .dock__text {
    color: #ffffff !important;
    font-weight: 800 !important;
}

/* FIM AJUDE O BRYAN - CTA FIXO AZUL V2 */


/* =========================================================
   AJUDE O BRYAN - TEMA AZUL + LARANJA V1
   ========================================================= */

:root {
    --bryan-blue: #0d8fe8;
    --bryan-blue-dark: #0867bd;
    --bryan-blue-soft: #eef8ff;

    --bryan-orange: #f47b20;
    --bryan-orange-dark: #d9610e;
    --bryan-orange-soft: #fff4eb;
}

/* =========================================================
   MODAL
   ========================================================= */

#donation-modal .donation-premium__panel {
    border-color: rgba(13,143,232,.18) !important;
}

/* selo superior */
#donation-modal .donation-premium__eyebrow,
#donation-modal .donation-premium__badge {
    color: var(--bryan-blue-dark) !important;
    background: var(--bryan-blue-soft) !important;
    border-color: rgba(13,143,232,.28) !important;
}

/* coração */
#donation-modal .donation-premium__heart,
#donation-modal .donation-premium__brand-heart {
    color: var(--bryan-blue) !important;
}

/* aviso "Selecione o valor..." */
#donation-modal .donation-premium__hint,
#donation-modal .donation-premium__notice {
    color: var(--bryan-blue-dark) !important;
    background: var(--bryan-blue-soft) !important;
    border-color: rgba(13,143,232,.25) !important;
}

/* =========================================================
   CARDS DE VALOR
   ========================================================= */

#donation-modal .pick-grid__item,
#donation-modal .pick-btn--grid {
    border-color: rgba(13,143,232,.42) !important;
}

/* valor */
#donation-modal .pick-btn--grid strong,
#donation-modal .pick-btn--grid .pick-btn__value,
#donation-modal [data-amount-cents] strong {
    color: var(--bryan-blue-dark) !important;
}

/* hover */
#donation-modal .pick-grid__item:hover,
#donation-modal .pick-btn--grid:hover {
    border-color: var(--bryan-blue) !important;
    box-shadow:
        0 10px 22px rgba(13,143,232,.12) !important;
}

/* selecionado / destacado */
#donation-modal .pick-grid__item.is-selected,
#donation-modal .pick-btn--grid.is-selected,
#donation-modal .pick-grid__item:has(.pick-btn--featured),
#donation-modal .pick-btn--featured {
    border-color: var(--bryan-blue) !important;
    background: linear-gradient(
        180deg,
        #ffffff 0%,
        var(--bryan-blue-soft) 100%
    ) !important;

    box-shadow:
        0 10px 24px rgba(13,143,232,.16) !important;
}

/* =========================================================
   SELO MAIS DOADO - LARANJA
   ========================================================= */

#donation-modal .pick-grid__item::before,
#donation-modal .pick-btn--grid::before,
#donation-modal .pick-btn__badge {
    background: var(--bryan-orange) !important;
    color: #ffffff !important;
    border-color: var(--bryan-orange-dark) !important;
}

/* =========================================================
   ÍCONES E BENEFÍCIOS
   ========================================================= */

#donation-modal .donation-premium__trust-item,
#donation-modal .donation-premium__trust-item svg,
#donation-modal .donation-premium__trust-item i {
    color: var(--bryan-blue-dark) !important;
}

#donation-modal .donation-premium__trust-icon {
    border-color: rgba(13,143,232,.4) !important;
    color: var(--bryan-blue) !important;
}

/* =========================================================
   RODAPÉ DO MODAL
   ========================================================= */

#donation-modal .donation-premium__footer {
    background: var(--bryan-blue-soft) !important;
    border-color: rgba(13,143,232,.24) !important;
}

#donation-modal .donation-premium__footer strong {
    color: var(--bryan-blue-dark) !important;
}

/* coração do rodapé */
#donation-modal .donation-premium__footer-heart {
    color: var(--bryan-orange) !important;
}

/* =========================================================
   PROGRESSO / ARRECADADO
   ========================================================= */

.progress__bar,
.progress-bar,
.campaign-progress__bar,
.campaign-progress__fill {
    background: linear-gradient(
        90deg,
        var(--bryan-blue) 0%,
        var(--bryan-blue-dark) 100%
    ) !important;
}

.progress__value,
.campaign-progress__value,
.campaign-card__amount {
    color: var(--bryan-blue-dark) !important;
}

/* percentual */
.progress__percent,
.campaign-progress__percent {
    color: var(--bryan-blue-dark) !important;
    background: var(--bryan-blue-soft) !important;
    border-color: rgba(13,143,232,.25) !important;
}

/* =========================================================
   LINKS / ÍCONES / DETALHES VERDES
   ========================================================= */

.story__article a,
.site-footer a,
.campaign-card a {
    color: var(--bryan-blue-dark) !important;
}

.campaign-card svg,
.campaign-card i,
.campaign-card .icon {
    color: var(--bryan-blue) !important;
}

/* =========================================================
   CTA FIXO
   ========================================================= */

.dock__btn {
    background: linear-gradient(
        135deg,
        var(--bryan-blue) 0%,
        var(--bryan-blue-dark) 100%
    ) !important;

    border: 2px solid var(--bryan-orange) !important;

    color: #ffffff !important;

    box-shadow:
        0 7px 20px rgba(13,143,232,.28),
        0 0 0 1px rgba(244,123,32,.10) !important;
}

.dock__btn:hover,
.dock__btn:focus,
.dock__btn:active {
    background: linear-gradient(
        135deg,
        #0b82d6 0%,
        #075ca9 100%
    ) !important;

    border-color: var(--bryan-orange-dark) !important;
}

/* =========================================================
   FIM AJUDE O BRYAN - TEMA AZUL + LARANJA V1
   ========================================================= */


/* =========================================================
   AJUDE O BRYAN - EXIT MODAL AZUL + LARANJA V1
   ========================================================= */

#exit-donation-modal .exit-donation__panel {
    border-color: rgba(13,143,232,.18) !important;
}

/* titulo */
#exit-donation-modal .exit-donation__title,
#exit-donation-modal h2 {
    color: #0b2b52 !important;
}

/* subtitulo */
#exit-donation-modal .exit-donation__subtitle,
#exit-donation-modal p {
    color: #52708f;
}

/* cards */
#exit-donation-modal .exit-donation__value,
#exit-donation-modal .exit-donation__option,
#exit-donation-modal [data-amount-cents] {
    background: linear-gradient(
        180deg,
        #ffffff 0%,
        #eef8ff 100%
    ) !important;

    border-color: rgba(13,143,232,.45) !important;

    box-shadow:
        0 8px 20px rgba(13,143,232,.08) !important;
}

/* hover */
#exit-donation-modal .exit-donation__value:hover,
#exit-donation-modal .exit-donation__option:hover,
#exit-donation-modal [data-amount-cents]:hover {
    border-color: #0d8fe8 !important;

    box-shadow:
        0 10px 24px rgba(13,143,232,.16) !important;
}

/* coracao dos cards */
#exit-donation-modal .exit-donation__value svg,
#exit-donation-modal .exit-donation__value i,
#exit-donation-modal .exit-donation__value .heart,
#exit-donation-modal .exit-donation__option svg,
#exit-donation-modal .exit-donation__option i {
    color: #0d8fe8 !important;
}

/* valores */
#exit-donation-modal .exit-donation__value strong,
#exit-donation-modal .exit-donation__amount,
#exit-donation-modal [data-amount-cents] strong {
    color: #0867bd !important;
}

/* pequenos selos "toque para escolher" */
#exit-donation-modal .exit-donation__value small,
#exit-donation-modal .exit-donation__label,
#exit-donation-modal .exit-donation__tag {
    color: #0867bd !important;
    background: #eef8ff !important;
}

/* selo mais escolhido - laranja */
#exit-donation-modal .exit-donation__value::before,
#exit-donation-modal .exit-donation__badge,
#exit-donation-modal .exit-donation__popular {
    background: #f47b20 !important;
    color: #ffffff !important;
    border-color: #d9610e !important;
}

/* link agora nao */
#exit-donation-modal .exit-donation__later,
#exit-donation-modal .exit-donation__skip,
#exit-donation-modal a {
    color: #0867bd !important;
}

/* rodape de seguranca */
#exit-donation-modal .exit-donation__footer,
#exit-donation-modal .exit-donation__security {
    background: #eef8ff !important;
    border-color: rgba(13,143,232,.20) !important;
    color: #52708f !important;
}

/* icone do rodape */
#exit-donation-modal .exit-donation__footer svg,
#exit-donation-modal .exit-donation__footer i,
#exit-donation-modal .exit-donation__security svg,
#exit-donation-modal .exit-donation__security i {
    color: #0d8fe8 !important;
}

/* botao fechar */
#exit-donation-modal .exit-donation__close,
#exit-donation-modal button[aria-label*="Fechar"],
#exit-donation-modal button[aria-label*="fechar"] {
    color: #0867bd !important;
    border-color: rgba(13,143,232,.20) !important;
}

/* detalhe decorativo principal */
#exit-donation-modal .exit-donation__icon,
#exit-donation-modal .exit-donation__hero-icon {
    color: #0d8fe8 !important;
}

/* destaque laranja */
#exit-donation-modal .exit-donation__accent {
    color: #f47b20 !important;
}

/* FIM AJUDE O BRYAN - EXIT MODAL AZUL + LARANJA V1 */


/* =========================================================
   AJUDE O BRYAN - EXIT MODAL FINAL V2
   Azul principal + laranja destaque
   ========================================================= */

#exit-donation-modal {
    --bryan-blue: #0d8fe8;
    --bryan-blue-dark: #0867bd;
    --bryan-blue-light: #eef8ff;
    --bryan-orange: #f47b20;
    --bryan-orange-dark: #db6410;
}

/* PAINEL - sem scroll interno desnecessario */
#exit-donation-modal .exit-donation__panel {
    overflow: visible !important;
    overflow-y: visible !important;
    max-height: none !important;

    border: 1px solid rgba(13, 143, 232, .22) !important;

    box-shadow:
        0 22px 55px rgba(7, 43, 78, .24),
        0 6px 18px rgba(244, 123, 32, .10) !important;
}

/* se existir container interno com scroll */
#exit-donation-modal .exit-donation__content,
#exit-donation-modal .exit-donation__body,
#exit-donation-modal .exit-donation__inner {
    overflow: visible !important;
    overflow-y: visible !important;
    max-height: none !important;
}

/* TITULO */
#exit-donation-modal h2,
#exit-donation-modal .exit-donation__title {
    color: #082a54 !important;
}

/* SUBTITULO */
#exit-donation-modal .exit-donation__subtitle {
    color: #52708f !important;
}

/* =========================================================
   CARDS
   ========================================================= */

#exit-donation-modal .exit-donation__value {
    background: linear-gradient(
        180deg,
        #ffffff 0%,
        #f2f9ff 100%
    ) !important;

    border: 2px solid rgba(13, 143, 232, .55) !important;

    box-shadow:
        0 8px 18px rgba(13, 143, 232, .08),
        0 3px 9px rgba(244, 123, 32, .06) !important;
}

/* Segundo card: destaque laranja sutil */
#exit-donation-modal .exit-donation__value:nth-child(2) {
    border-color: var(--bryan-orange) !important;

    box-shadow:
        0 10px 22px rgba(244, 123, 32, .15),
        0 4px 12px rgba(13, 143, 232, .08) !important;
}

/* hover */
#exit-donation-modal .exit-donation__value:hover {
    border-color: var(--bryan-blue) !important;

    box-shadow:
        0 12px 26px rgba(13, 143, 232, .17),
        0 4px 12px rgba(244, 123, 32, .10) !important;
}

/* =========================================================
   VALORES
   ========================================================= */

#exit-donation-modal .exit-donation__value strong,
#exit-donation-modal .exit-donation__amount {
    color: var(--bryan-blue-dark) !important;
}

/* coracoes */
#exit-donation-modal .exit-donation__value svg,
#exit-donation-modal .exit-donation__value i {
    color: var(--bryan-blue) !important;
}

/* =========================================================
   TAG TOQUE PARA ESCOLHER
   ========================================================= */

#exit-donation-modal .exit-donation__value small,
#exit-donation-modal .exit-donation__label,
#exit-donation-modal .exit-donation__tag {
    background: var(--bryan-blue-light) !important;
    color: var(--bryan-blue-dark) !important;
}

/* =========================================================
   MAIS ESCOLHIDO
   ========================================================= */

#exit-donation-modal .exit-donation__value:nth-child(2)::before,
#exit-donation-modal .exit-donation__badge,
#exit-donation-modal .exit-donation__popular {
    background: var(--bryan-orange) !important;
    color: #fff !important;
    border-color: var(--bryan-orange-dark) !important;
}

/* =========================================================
   REMOVE VERDES HERDADOS
   ========================================================= */

#exit-donation-modal .exit-donation__value,
#exit-donation-modal .exit-donation__value *,
#exit-donation-modal .exit-donation__footer,
#exit-donation-modal .exit-donation__security {
    --green: var(--bryan-blue) !important;
    --success: var(--bryan-blue) !important;
}

/* =========================================================
   AGORA NAO
   ========================================================= */

#exit-donation-modal .exit-donation__later,
#exit-donation-modal .exit-donation__skip,
#exit-donation-modal a {
    color: var(--bryan-blue-dark) !important;
}

/* =========================================================
   RODAPE
   ========================================================= */

#exit-donation-modal .exit-donation__footer,
#exit-donation-modal .exit-donation__security {
    background: linear-gradient(
        180deg,
        #f5fbff 0%,
        #edf7ff 100%
    ) !important;

    color: #52708f !important;

    border-color: rgba(13,143,232,.18) !important;
}

#exit-donation-modal .exit-donation__footer svg,
#exit-donation-modal .exit-donation__footer i,
#exit-donation-modal .exit-donation__security svg,
#exit-donation-modal .exit-donation__security i {
    color: var(--bryan-blue) !important;
}

/* =========================================================
   FECHAR
   ========================================================= */

#exit-donation-modal .exit-donation__close {
    color: var(--bryan-blue-dark) !important;
    border-color: rgba(13,143,232,.25) !important;
    background: #fff !important;
}

/* =========================================================
   MOBILE - FAZ CABER NO POPUP
   ========================================================= */

@media (max-width: 600px) {

    #exit-donation-modal {
        padding: 12px !important;
    }

    #exit-donation-modal .exit-donation__panel {
        width: min(390px, calc(100vw - 24px)) !important;
        max-height: calc(100dvh - 24px) !important;

        overflow: hidden !important;
        overflow-y: hidden !important;

        padding-top: 20px !important;
        padding-bottom: 14px !important;
    }

    #exit-donation-modal .exit-donation__title {
        margin-top: 8px !important;
        margin-bottom: 6px !important;
    }

    #exit-donation-modal .exit-donation__subtitle {
        margin-bottom: 14px !important;
    }

    #exit-donation-modal .exit-donation__values {
        gap: 10px !important;
    }

    #exit-donation-modal .exit-donation__value {
        min-height: 176px !important;
        padding-top: 14px !important;
        padding-bottom: 12px !important;
    }

    #exit-donation-modal .exit-donation__footer,
    #exit-donation-modal .exit-donation__security {
        margin-top: 8px !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
}

/* FIM AJUDE O BRYAN - EXIT MODAL FINAL V2 */


/* =========================================================
   AJUDE O BRYAN - VISUAL FINAL V3
   Azul + laranja, sem verde
   ========================================================= */

:root {
    --bryan-blue: #1599e5;
    --bryan-blue-dark: #075ca8;
    --bryan-blue-deep: #064b8e;
    --bryan-blue-soft: #eef8ff;

    --bryan-orange: #f47b20;
    --bryan-orange-dark: #d9610e;
    --bryan-orange-soft: #fff4eb;
}

/* =========================================================
   CTA FIXO
   ========================================================= */

.dock__btn {
    background: linear-gradient(
        135deg,
        var(--bryan-blue) 0%,
        var(--bryan-blue-dark) 100%
    ) !important;

    border: 2px solid var(--bryan-blue-deep) !important;

    color: #fff !important;

    box-shadow:
        0 7px 20px rgba(7,92,168,.28),
        0 2px 7px rgba(6,75,142,.14) !important;
}

/* circulo do coração */
.dock__btn .dock__icon {
    background: var(--bryan-blue-deep) !important;
    color: #fff !important;

    border: 0 !important;

    box-shadow:
        0 3px 8px rgba(6,75,142,.24) !important;
}

/* texto */
.dock__btn .dock__text {
    color: #fff !important;
}

/* hover */
.dock__btn:hover,
.dock__btn:focus,
.dock__btn:active {
    background: linear-gradient(
        135deg,
        #118bd2 0%,
        #064f94 100%
    ) !important;

    border-color: #043f79 !important;
}

/* =========================================================
   EXIT MODAL
   ========================================================= */

#exit-donation-modal {
    padding: 12px !important;
}

/* painel inteiro sem scroll */
#exit-donation-modal .exit-donation__panel {
    width: min(390px, calc(100vw - 24px)) !important;

    max-height: none !important;
    height: auto !important;

    overflow: hidden !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;

    padding:
        18px
        18px
        14px !important;

    border:
        1px solid
        rgba(21,153,229,.20) !important;

    box-shadow:
        0 24px 55px rgba(6,47,87,.25),
        0 5px 15px rgba(244,123,32,.08) !important;
}

/* qualquer container interno que esteja criando scroll */
#exit-donation-modal .exit-donation__content,
#exit-donation-modal .exit-donation__body,
#exit-donation-modal .exit-donation__inner {
    max-height: none !important;
    height: auto !important;

    overflow: visible !important;
    overflow-y: visible !important;
}

/* =========================================================
   ESPACAMENTO MAIS COMPACTO
   ========================================================= */

#exit-donation-modal .exit-donation__hero {
    margin-bottom: 8px !important;
}

#exit-donation-modal .exit-donation__title {
    margin-top: 5px !important;
    margin-bottom: 5px !important;

    color: #082a54 !important;
}

#exit-donation-modal .exit-donation__subtitle {
    margin-top: 0 !important;
    margin-bottom: 13px !important;

    color: #476986 !important;
}

/* =========================================================
   CARDS
   ========================================================= */

#exit-donation-modal .exit-donation__values {
    gap: 10px !important;
    margin-bottom: 9px !important;
}

#exit-donation-modal .exit-donation__value {
    min-height: 174px !important;

    padding:
        13px
        8px
        11px !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #eef8ff 100%
        ) !important;

    border:
        2px solid
        rgba(21,153,229,.55) !important;

    box-shadow:
        0 7px 16px rgba(7,92,168,.09) !important;
}

/* primeiro card */
#exit-donation-modal .exit-donation__value:nth-child(1) {
    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #eef8ff 100%
        ) !important;

    border-color:
        #73c5f4 !important;
}

/* segundo card destacado */
#exit-donation-modal .exit-donation__value:nth-child(2) {
    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fff5ed 100%
        ) !important;

    border-color:
        var(--bryan-orange) !important;

    box-shadow:
        0 9px 20px rgba(244,123,32,.16) !important;
}

/* =========================================================
   CORACOES DOS CARDS
   ========================================================= */

#exit-donation-modal .exit-donation__value svg,
#exit-donation-modal .exit-donation__value i,
#exit-donation-modal .exit-donation__value .heart {
    color: var(--bryan-blue) !important;
}

/* qualquer fundo antigo do icone */
#exit-donation-modal .exit-donation__value svg,
#exit-donation-modal .exit-donation__value i {
    background: transparent !important;
}

/* =========================================================
   VALORES
   ========================================================= */

#exit-donation-modal .exit-donation__value strong,
#exit-donation-modal .exit-donation__amount {
    color:
        var(--bryan-blue-dark) !important;
}

/* =========================================================
   TOQUE PARA ESCOLHER
   ========================================================= */

#exit-donation-modal .exit-donation__label,
#exit-donation-modal .exit-donation__tag,
#exit-donation-modal .exit-donation__value small {
    color:
        var(--bryan-blue-dark) !important;

    background:
        var(--bryan-blue-soft) !important;
}

/* =========================================================
   DESCRICOES DOS CARDS
   ========================================================= */

#exit-donation-modal .exit-donation__value p,
#exit-donation-modal .exit-donation__value span {
    border-color: transparent;
}

/* elimina fundos verdes pequenos */
#exit-donation-modal .exit-donation__value span:not(.exit-donation__amount),
#exit-donation-modal .exit-donation__value small {
    background-color:
        var(--bryan-blue-soft) !important;
}

/* =========================================================
   MAIS ESCOLHIDO - LARANJA
   ========================================================= */

#exit-donation-modal .exit-donation__value:nth-child(2)::before,
#exit-donation-modal .exit-donation__badge,
#exit-donation-modal .exit-donation__popular {
    background:
        var(--bryan-orange) !important;

    color:
        #ffffff !important;

    border-color:
        var(--bryan-orange-dark) !important;
}

/* =========================================================
   REMOVE VERDE DE PSEUDO-ELEMENTOS
   ========================================================= */

#exit-donation-modal
.exit-donation__value::after {
    border-color:
        var(--bryan-blue) !important;
}

#exit-donation-modal
.exit-donation__value:nth-child(2)::after {
    border-color:
        var(--bryan-orange) !important;
}

/* =========================================================
   AGORA NAO
   ========================================================= */

#exit-donation-modal .exit-donation__later,
#exit-donation-modal .exit-donation__skip,
#exit-donation-modal a {
    color:
        var(--bryan-blue-dark) !important;
}

/* =========================================================
   RODAPE
   ========================================================= */

#exit-donation-modal .exit-donation__footer,
#exit-donation-modal .exit-donation__security {
    margin-top:
        6px !important;

    padding:
        9px
        10px !important;

    background:
        linear-gradient(
            180deg,
            #f4faff 0%,
            #eaf6ff 100%
        ) !important;

    color:
        #476986 !important;

    border-color:
        rgba(21,153,229,.18) !important;
}

/* ícone segurança */
#exit-donation-modal .exit-donation__footer svg,
#exit-donation-modal .exit-donation__footer i,
#exit-donation-modal .exit-donation__security svg,
#exit-donation-modal .exit-donation__security i {
    color:
        var(--bryan-blue-dark) !important;

    border-color:
        var(--bryan-blue-dark) !important;
}

/* =========================================================
   BOTAO FECHAR
   ========================================================= */

#exit-donation-modal .exit-donation__close {
    color:
        var(--bryan-blue-dark) !important;

    background:
        #ffffff !important;

    border-color:
        rgba(21,153,229,.25) !important;
}

/* =========================================================
   GARANTIA CONTRA SCROLLBAR
   ========================================================= */

#exit-donation-modal .exit-donation__panel {
    scrollbar-width: none !important;
}

#exit-donation-modal
.exit-donation__panel::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    #exit-donation-modal .exit-donation__panel {
        width:
            min(
                390px,
                calc(100vw - 24px)
            ) !important;

        padding:
            16px
            16px
            12px !important;
    }

    #exit-donation-modal
    .exit-donation__values {
        gap: 9px !important;
    }

    #exit-donation-modal
    .exit-donation__value {
        min-height:
            168px !important;
    }
}

/* FIM AJUDE O BRYAN - VISUAL FINAL V3 */



/* BRYAN STORY TITLES BLUE V1 */

/* Tracinho vertical dos titulos da historia */
.story__article h2::before {
    background: linear-gradient(
        180deg,
        #18a5ef 0%,
        #0874c9 100%
    ) !important;

    box-shadow:
        0 2px 7px rgba(8, 116, 201, .20) !important;
}

/* FIM BRYAN STORY TITLES BLUE V1 */


/* =========================================================
   AJUDE O BRYAN - STORY CARDS + CTA FINAL AZUL V1
   ========================================================= */

/* =========================================================
   LISTA DE DESTINACAO DOS RECURSOS
   ========================================================= */

/* caixas */
.story__article ul li {
    background: linear-gradient(
        180deg,
        #ffffff 0%,
        #f1f9ff 100%
    ) !important;

    border: 1px solid rgba(13, 143, 232, .20) !important;

    color: #103352 !important;

    box-shadow:
        0 4px 10px rgba(8, 103, 189, .04) !important;
}

/* icones/checks da lista */
.story__article ul li::before {
    color: #0d8fe8 !important;
}

/* caso o check seja texto/emoji dentro do li */
.story__article ul li {
    --success: #0d8fe8 !important;
    --green: #0d8fe8 !important;
}

/* realce ao tocar/hover */
.story__article ul li:hover {
    border-color: rgba(13, 143, 232, .42) !important;

    box-shadow:
        0 7px 16px rgba(8, 103, 189, .08) !important;
}

/* =========================================================
   BOTAO FINAL DA HISTORIA
   ========================================================= */

.story__article button,
.story__article .story__cta,
.story__article .donation-button,
.story__article a.button,
.story__article a.btn {
    background: linear-gradient(
        135deg,
        #1599e5 0%,
        #075ca8 100%
    ) !important;

    color: #ffffff !important;

    border: 2px solid #064b8e !important;

    box-shadow:
        0 7px 18px rgba(7, 92, 168, .24) !important;
}

/* hover */
.story__article button:hover,
.story__article .story__cta:hover,
.story__article .donation-button:hover,
.story__article a.button:hover,
.story__article a.btn:hover {
    background: linear-gradient(
        135deg,
        #118bd2 0%,
        #064f94 100%
    ) !important;

    border-color: #043f79 !important;
}

/* =========================================================
   GARANTIA PARA O BOTAO "ESCOLHER VALOR E DOAR"
   ========================================================= */

button.js-open-donation,
a.js-open-donation {
    background: linear-gradient(
        135deg,
        #1599e5 0%,
        #075ca8 100%
    ) !important;

    color: #ffffff !important;

    border-color: #064b8e !important;

    box-shadow:
        0 7px 18px rgba(7,92,168,.24) !important;
}

/* =========================================================
   FIM AJUDE O BRYAN - STORY CARDS + CTA FINAL AZUL V1
   ========================================================= */


/* =========================================================
   AJUDE O BRYAN - CARD ARRECADACAO V1
   Azul + verde + laranja
   ========================================================= */

/* Card principal */
.campaign-progress,
.campaign-card,
.progress-card,
.donation-progress {
    border-color: rgba(13, 143, 232, .18) !important;

    box-shadow:
        0 8px 22px rgba(7, 92, 168, .06) !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfdff 100%
        ) !important;
}

/* =========================================================
   ICONE DA ESQUERDA
   ========================================================= */

.campaign-progress__icon,
.campaign-card__icon,
.progress__icon,
.progress-card__icon {
    color: #0876c9 !important;

    background: #eef8ff !important;

    border-color: rgba(13,143,232,.18) !important;
}

/* =========================================================
   VALOR ARRECADADO
   Mantemos verde porque representa sucesso/arrecadacao
   ========================================================= */

.campaign-progress__amount,
.campaign-card__amount,
.progress__amount,
.progress-card__amount {
    color: #00a950 !important;
}

/* =========================================================
   META
   ========================================================= */

.campaign-progress__goal,
.campaign-card__goal,
.progress__goal,
.progress-card__goal {
    color: #0b2b52 !important;
}

/* =========================================================
   PERCENTUAL - LARANJA
   ========================================================= */

.campaign-progress__percent,
.campaign-card__percent,
.progress__percent,
.progress-card__percent {
    color: #d9610e !important;

    background: #fff3e9 !important;

    border-color: rgba(244,123,32,.25) !important;

    box-shadow:
        0 3px 9px rgba(244,123,32,.08) !important;
}

/* =========================================================
   BARRA DE PROGRESSO
   ========================================================= */

.campaign-progress__track,
.campaign-card__track,
.progress__track,
.progress-bar {
    background: #e5edf4 !important;
}

/* preenchimento azul */
.campaign-progress__fill,
.campaign-card__fill,
.progress__fill,
.progress-bar__fill {
    background: linear-gradient(
        90deg,
        #19a5ed 0%,
        #0873c5 100%
    ) !important;

    box-shadow:
        0 2px 7px rgba(8,115,197,.20) !important;
}

/* =========================================================
   RODAPE DO CARD
   ========================================================= */

.campaign-progress__footer,
.campaign-card__footer,
.progress__footer,
.progress-card__footer {
    border-top-color: rgba(13,143,232,.12) !important;
}

/* textos */
.campaign-progress__footer,
.campaign-card__footer,
.progress__footer,
.progress-card__footer {
    color: #52708f !important;
}

/* icones do rodape */
.campaign-progress__footer svg,
.campaign-progress__footer i,
.campaign-card__footer svg,
.campaign-card__footer i,
.progress__footer svg,
.progress__footer i {
    color: #0d8fe8 !important;
}

/* links / compartilhar */
.campaign-progress__footer a,
.campaign-card__footer a,
.progress__footer a {
    color: #38698f !important;
}

/* divisoria */
.campaign-progress__footer > * + *,
.campaign-card__footer > * + *,
.progress__footer > * + * {
    border-left-color: rgba(13,143,232,.12) !important;
}

/* =========================================================
   FIM AJUDE O BRYAN - CARD ARRECADACAO V1
   ========================================================= */



/* BRYAN PROGRESS CARD FINAL V2 */

/* Card */
.progress-card {
    border: 1px solid rgba(20, 151, 229, .18) !important;
    background: linear-gradient(
        180deg,
        #ffffff 0%,
        #fbfdff 100%
    ) !important;
    box-shadow:
        0 7px 20px rgba(7, 92, 168, .06) !important;
}

/* ARRECADADO */
.progress-card__label {
    color: #66819b !important;
}

/* Valor arrecadado - azul principal */
.progress-card__raised {
    color: #0878c9 !important;
}

/* Meta */
.progress-card__goal {
    color: #082f57 !important;
}

/* Percentual - destaque laranja */
.progress-card__pct {
    color: #d9610e !important;
    background: #fff2e8 !important;
    border: 1px solid rgba(244, 123, 32, .26) !important;
    box-shadow:
        0 3px 9px rgba(244, 123, 32, .08) !important;
}

/* Fundo da barra */
.progress-card__track {
    background: #e3edf5 !important;
}

/* Progresso - azul */
.progress-card__fill {
    background: linear-gradient(
        90deg,
        #19a6ed 0%,
        #0874c9 100%
    ) !important;

    box-shadow:
        0 1px 5px rgba(8, 116, 201, .22) !important;
}

/* FIM BRYAN PROGRESS CARD FINAL V2 */



/* BRYAN PROGRESS PREMIUM BLUE V3 */

/* Valor arrecadado */
.progress-card--premium .progress-card__raised {
    color: #0878c9 !important;
}

/* Percentual */
.progress-card--premium .progress-card__pct {
    color: #d9610e !important;
    background: #fff2e8 !important;
    border: 1px solid rgba(244, 123, 32, .32) !important;
    box-shadow: 0 3px 10px rgba(244, 123, 32, .10) !important;
}

/* Barra de progresso */
.progress-card--premium .progress-card__fill {
    background: linear-gradient(
        90deg,
        #19a6ed 0%,
        #0874c9 100%
    ) !important;

    box-shadow: 0 1px 5px rgba(8, 116, 201, .22) !important;
}

/* Fundo da barra */
.progress-card--premium .progress-card__track {
    background: #e3edf5 !important;
}

/* Meta */
.progress-card--premium .progress-card__goal {
    color: #082f57 !important;
}

/* FIM BRYAN PROGRESS PREMIUM BLUE V3 */

/* =========================================================
   AJUDE O BRYAN - PROGRESS ICONS BLUE V1
   ========================================================= */

/* icone principal da esquerda */
.progress-card--premium .progress-premium__icon,
.progress-card--premium .progress-card__icon,
.progress-card--premium .progress-premium__icon svg,
.progress-card--premium .progress-premium__icon i {
    color: #0878c9 !important;
    border-color: rgba(8,120,201,.20) !important;
    background: #eef8ff !important;
}

/* apoio / cada ajuda faz diferenca */
.progress-card--premium .progress-premium__support,
.progress-card--premium .progress-premium__support svg,
.progress-card--premium .progress-premium__support i {
    color: #0878c9 !important;
}

/* compartilhar */
.progress-card--premium .progress-premium__share,
.progress-card--premium .progress-premium__share svg,
.progress-card--premium .progress-premium__share i {
    color: #0878c9 !important;
}

/* divisoria inferior */
.progress-card--premium .progress-premium__footer {
    border-top-color: rgba(8,120,201,.12) !important;
}

/* FIM AJUDE O BRYAN - PROGRESS ICONS BLUE V1 */

/* =========================================================
   BRYAN - ICONES INFERIORES LARANJA V1
   ========================================================= */

/* Cor laranja apenas nos icones */
.progress-card--premium .progress-premium__support svg,
.progress-card--premium .progress-premium__support i,
.progress-card--premium .progress-premium__share svg,
.progress-card--premium .progress-premium__share i {
    color: #f47b20 !important;
    fill: #f47b20 !important;
    stroke: #f47b20 !important;
}

/* Caso os icones usem pseudo-elementos */
.progress-card--premium .progress-premium__support::before,
.progress-card--premium .progress-premium__share::before {
    color: #f47b20 !important;
}

/* Textos continuam azuis */
.progress-card--premium .progress-premium__support,
.progress-card--premium .progress-premium__share {
    color: #17689f !important;
}

/* FIM BRYAN - ICONES INFERIORES LARANJA V1 */


/* BRYAN FOOTER ICONS ORANGE FINAL V2 */

/* coração */
.progress-card--premium
.progress-premium__people-icon {
    color: #f47b20 !important;
}

/* seta de compartilhar */
.progress-card--premium
.progress-premium__share-icon {
    color: #f47b20 !important;
}

/* textos permanecem azuis */
.progress-card--premium
.progress-premium__support > span:not(.progress-premium__people-icon),
.progress-card--premium
.progress-premium__share > span:not(.progress-premium__share-icon) {
    color: #17689f !important;
}

/* divisória em azul suave */
.progress-card--premium
.progress-premium__separator {
    background: rgba(8, 120, 201, .14) !important;
}

/* FIM BRYAN FOOTER ICONS ORANGE FINAL V2 */

