.big-numbers {
    --kpi-sd: 0.95;
    --kpi-ss: 1.32;
    --kpi-shs: 1;
    --kpi-optical: 12px;
}

    .big-numbers .tpc__track {
        gap: 48px;
    }

    .big-numbers .kpi-ch--char {
        display: inline-flex;
        align-items: center;
        font-family: var(--font-tpSans-exLight);
        font-size: 120px; /* ajuste conforme o tamanho real dos números ao lado */
        line-height: 1;
        color: var(--grey-950, #5318bf);
    }

    .big-numbers .kpi__content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 25px;
    }

    .big-numbers .tpc__viewport {
        overflow-y: unset;
    }

    .big-numbers .tpc__slide {
        flex: none;
        min-width: 960px;
    }

    .big-numbers .kpi {
        display: inline-flex;
        gap: 32px;
        width: 100%;
    }

    .big-numbers .kpi__num {
        display: flex;
        align-items: flex-start;
        gap: 24px;
        flex: none;
        isolation: isolate;
    }

    .big-numbers .kpi-ch {
        position: relative;
        flex: none;
        --s: var(--kpi-sd);
        width: calc(var(--gw) * var(--s) * 1px);
        height: calc(var(--gh) * var(--s) * 1px);
    }

    .big-numbers .kpi-full {
        position: absolute;
        display: block;
        height: auto;
        width: calc(var(--vbw) * var(--s) * 1px);
        left: calc(var(--gx) * var(--s) * -1px);
        top: calc(var(--gy) * var(--s) * -1px);
    }

    .big-numbers .kpi-shadow {
        z-index: 1;
        pointer-events: none;
        --ss: calc(var(--kpi-sd) * var(--kpi-shs));
        width: calc(var(--vbw) * var(--ss) * 1px);
        left: calc(var(--gx) * var(--ss) * -1px);
        top: calc(var(--gy) * var(--ss) * -1px);
        max-width: none;
        overflow: visible;
    }

    .big-numbers .kpi-glyph {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: auto;
        z-index: 2;
        display: block;
    }

    .big-numbers .kpi-sym {
        z-index: 2;
    }

    .big-numbers .kpi-ch--sym {
        --s: var(--kpi-ss);
        align-self: center;
        transform: translateY(calc(var(--kpi-optical) * -1));
    }

    .big-numbers .kpi-ch--0 {
        --gx: 82;
        --gy: 38;
        --gw: 188.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--1 {
        --gx: 82;
        --gy: 38;
        --gw: 160.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--2 {
        --gx: 82;
        --gy: 38;
        --gw: 163.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--3 {
        --gx: 82;
        --gy: 38;
        --gw: 170.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--4 {
        --gx: 82;
        --gy: 38;
        --gw: 155.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--5 {
        --gx: 79;
        --gy: 38;
        --gw: 166.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--6 {
        --gx: 82;
        --gy: 38;
        --gw: 173.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--7 {
        --gx: 82;
        --gy: 38;
        --gw: 167.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--8 {
        --gx: 86;
        --gy: 38;
        --gw: 171.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--9 {
        --gx: 82;
        --gy: 38;
        --gw: 174.1;
        --gh: 284;
        --vbw: 535;
    }

    .big-numbers .kpi-ch--126 {
        /*TIL*/
        width: 80px;
        height: auto;
        left: 0;
        top: 94px;
    }

    .big-numbers .kpi-ch--37 {
        /*PORCENTAGEM*/
        width: 80px;
        height: auto;
        left: 0;
        top: 78px;
    }

    .big-numbers .kpi-ch--43 {
        /*MAIS*/
        width: 80px;
        height: auto;
        left: 0;
        top: 94px;
    }

    .big-numbers .kpi__desc {
        flex: none;
        max-width: 350px;
        font-weight: var(--fw-extralight);
        font-family: var(--font-tpSans-exLight);
        color: var(--title-default);
        transform: translateY(calc(var(--kpi-optical) * -1));
    }

    .big-numbers .kpi__icon-after-image {
        width: 60px;
        height: 60px;
    }

        .big-numbers .kpi__icon-after-image img {
            width: 100%;
            height: 100%;
        }

@media (max-width: 1024px) {
    .big-numbers .tpc__slide {
        flex: 0 0 88vw;
        max-width: 88vw;
        min-width: 0;
    }

    .big-numbers .kpi__desc {
        max-width: 270px;
    }

    .big-numbers .kpi__icon-after-image {
        width: 40px;
        height: 40px;
    }
}

@media (max-width: 767px) {
    .big-numbers .kpi__icon-after-image {
        position: absolute;
        top: 0;
        right: -40px;
        z-index: 2;
    }

    .big-numbers .asn {
        gap: 8px;
    }

    .big-numbers .kpi__content {
        margin-top: 24px;
    }

    .big-numbers .kpi__icon-after-image {
        width: 30px;
        height: 30px;
    }

    .big-numbers .kpi__num {
        margin-right: auto;
    }

    .big-numbers .tpc__slide {
        flex: none;
        max-width: 100%;
    }

    .big-numbers .kpi {
        flex-direction: column;
        align-items: start;
        height: auto;
        gap: 8px;
    }

    .big-numbers {
        --kpi-sd: 0.4;
        --kpi-ss: 0.7;
        --kpi-optical: 6px;
    }
}


/* ============================================================
   about-sticky.css — "Sticky content" (ISOLADO, .about-sticky / .ast__*).
   Figma VRxYRQgtNch1TcMaMofWFF: 1920 293:13915 · 1440 293:13770 · 992 293:14065 ·
   tablet 293:14202 · mobile 293:14605. Tokens da host. Desktop-first (base fiel 1440).
   Breakpoints: 1024 · 768 · 680.

   NÚMEROS: sistema .asn-* (Figma "04 - Components Library Shadow" msQzsXCtdq3AbOx4eHdS0s,
   componente _shadowed-number 40000024:924). Cada char BRANCO = glyph SVG + sombra longa raster
   (aspect 1:1) que VAZA da caixa; unidade (%, B, M) = TEXTO escuro. Base do número = 220px de
   altura, escalada por --asn-h. Métricas (caixa/glyph/sombra) extraídas 1:1 do design context.
   ⚠️ BACKGROUND: #F4F6F8 (--bg-neutral-subtle) — os glyphs BRANCOS leem sobre ele (no branco puro
   sumiriam). ⚠️ O sticky depende de `align-items: flex-start` no container flex.
   ============================================================ */
.big-numbers .about-sticky {
    background: var(--bg-neutral-subtle); /* #F4F6F8 — fundo do design dos números */
    padding: 80px 40px;
    display: flex;
    gap: 64px;
    align-items: flex-start; /* obrigatório p/ o sticky funcionar */
    overflow-x: clip; /* contém o vazamento horizontal das sombras SEM quebrar
                                            o sticky (clip não vira scroll container; hidden viraria) */
}

/* ---------- coluna esquerda (sticky) ---------- */
.big-numbers .ast__text {
    flex: 1 0 0;
    min-width: 0;
    position: sticky;
    top: 136px; /* 96 do header sticky + 40 de respiro */
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
}

.big-numbers .ast__bar {
    position: relative;
    display: block;
    width: 200px;
    height: 17px;
    transform-origin: 0 50%;
    transition: transform 900ms var(--ease);
    will-change: transform;
}

    .big-numbers .ast__bar.bar-anim {
        transform: scaleX(0);
    }

        .big-numbers .ast__bar.bar-anim.is-in {
            transform: scaleX(1);
        }

    .big-numbers .ast__bar img {
        position: absolute;
        top: 0;
        left: -11px;
        display: block;
        width: 284px;
        height: 177px;
        max-width: none;
    }

.big-numbers .ast__title {
    margin: 0;
    width: 100%;
    font-family: var(--font-tpSans-exLight);
    font-weight: var(--fw-extralight);
    font-size: 56px;
    line-height: 56px;
    letter-spacing: 0;
    color: var(--title-default);
}

.big-numbers .ast__body p {
    margin: 0;
    font-family: var(--font-tpSans-light);
    font-weight: var(--fw-light);
    font-size: 24px;
    line-height: 32px;
    color: var(--body-default);
}

/* ---------- coluna direita (números) ---------- */
.big-numbers .ast__list {
    flex: 1 0 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 80px;
}

.big-numbers .ast__item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
    width: 100%;
}

/* ============================================================
   Sistema de números "shadowed" (.asn-*) — glyph branco + sombra longa raster + unidade texto.
   --asn-h = altura do número (220 base). --asn-k = px por "unidade" de métrica (220 → 1px).
   Vars por char (unitless), multiplicadas por --asn-k:
     --w caixa · --gw/--gh glyph · --glx/--gly nudge do glyph (centrado) · --shs sombra (quadrada)
     --shl/--sht canto sup-esq da sombra. Tudo extraído do design context 40000024:924.
   ============================================================ */
.big-numbers .asn {
    --asn-h: 220px;
    --asn-k: calc(var(--asn-h) / 220); /* comprimento: 1px por unidade @220 */
    display: flex;
    align-items: start; /* dígitos/vírgula/ponto (caixa 220) centrados; ~ (44) e unidade alinham */
    gap: 16px; /* 8px entre chars @220 */
    isolation: isolate; /* todas as sombras (z1) ficam sob todos os glyphs (z2) */
    max-width: 100%;
}

.big-numbers .asn-ch {
    position: relative;
    flex: none;
    height: calc(220 * var(--asn-k));
    width: calc(var(--w) * var(--asn-k));
}

.big-numbers .asn-gl { /* glyph branco — padrão: centrado (dígitos) */
    position: absolute;
    z-index: 2;
    display: block;
    max-width: none;
    width: calc(var(--gw) * var(--asn-k));
    height: calc(var(--gh) * var(--asn-k));
    left: 50%;
    top: 50%;
    transform: translate(calc(-50% + var(--glx, 0) * var(--asn-k)), calc(-50% + var(--gly, 0) * var(--asn-k)));
}

.big-numbers .asn-sh { /* sombra longa raster (quadrada), vaza da caixa */
    position: absolute;
    z-index: 1;
    display: block;
    max-width: none;
    pointer-events: none;
    width: calc(var(--shs) * var(--asn-k));
    height: calc(var(--shs) * var(--asn-k));
    left: calc(var(--shl) * var(--asn-k));
    top: calc(var(--sht) * var(--asn-k));
}

/* dígitos 0-9 (caixa/glyph/sombra) */
.big-numbers .asn-ch--0 {
    --w: 142;
    --gw: 133;
    --gh: 212;
    --glx: 0;
    --gly: -3;
    --shs: 390;
    --shl: -60;
    --sht: -26;
}

.big-numbers .asn-ch--1 {
    --w: 120;
    --gw: 115.806;
    --gh: 206.831;
    --glx: 0;
    --gly: -6.5;
    --shs: 390;
    --shl: -59.25;
    --sht: -27.5;
}

.big-numbers .asn-ch--2 {
    --w: 118;
    --gw: 118.746;
    --gh: 206.282;
    --glx: 0;
    --gly: -6.5;
    --shs: 390;
    --shl: -60.25;
    --sht: -27.5;
}

.big-numbers .asn-ch--3 {
    --w: 121;
    --gw: 122.394;
    --gh: 208.38;
    --glx: -0.5;
    --gly: -5.5;
    --shs: 390;
    --shl: -62.25;
    --sht: -27.5;
}

.big-numbers .asn-ch--4 {
    --w: 120;
    --gw: 112.324;
    --gh: 211.704;
    --glx: -2;
    --gly: -4;
    --shs: 390;
    --shl: -60.25;
    --sht: -24.5;
}

.big-numbers .asn-ch--5 {
    --w: 116;
    --gw: 115.423;
    --gh: 207.606;
    --glx: -0.5;
    --gly: -6;
    --shs: 390;
    --shl: -61.25;
    --sht: -27.5;
}

.big-numbers .asn-ch--6 {
    --w: 124;
    --gw: 123.944;
    --gh: 203.901;
    --glx: 0;
    --gly: -7;
    --shs: 390;
    --shl: -62.25;
    --sht: -28.5;
}

.big-numbers .asn-ch--7 {
    --w: 122;
    --gw: 122.188;
    --gh: 207.606;
    --glx: 0;
    --gly: -6;
    --shs: 390;
    --shl: -60.25;
    --sht: -26.5;
}

.big-numbers .asn-ch--8 {
    --w: 126;
    --gw: 125;
    --gh: 205.5;
    --glx: 0;
    --gly: -7.5;
    --shs: 390;
    --shl: -62.25;
    --sht: -29.5;
}

.big-numbers .asn-ch--9 {
    --w: 124;
    --gw: 124.718;
    --gh: 205.282;
    --glx: -0.5;
    --gly: -6.5;
    --shs: 390;
    --shl: -61.25;
    --sht: -28.5;
}

/* ~ (til): caixa 96×44, glyph ocupa a largura e centra na vertical */
.big-numbers .asn-ch--til {
    --w: 96;
    --gw: 96;
    --gh: 26.585;
    --shs: 319;
    --shl: -31.69;
    --sht: -77.85;
    height: calc(44 * var(--asn-k));
    margin-right: calc(16 * var(--asn-k));
    margin-block: auto;
}

    .big-numbers .asn-ch--til .asn-gl {
        left: 0;
        top: 50%;
        transform: translateY(-50%);
    }

/* vírgula e ponto: glyph pequeno ancorado na BASE (baseline), centrado na horizontal */
.big-numbers .asn-ch--comma {
    --w: 40;
    --gw: 35.833;
    --gh: 67.186;
    --shs: 321;
    --shl: -48.5;
    --sht: 85;
}

.big-numbers .asn-ch--dot {
    --w: 24;
    --gw: 13.527;
    --gh: 13.527;
    --shs: 180;
    --shl: -22;
    --sht: 168;
}

    .big-numbers .asn-ch--comma .asn-gl,
    .big-numbers .asn-ch--dot .asn-gl {
        left: 50%;
        top: auto;
        bottom: 0;
        transform: translateX(-50%);
    }

.big-numbers .big-numbers .asn-unit {
    align-self: flex-start;
    margin-left: calc(16 * var(--asn-k)); /* +8 do gap = 24 (frame) */
    margin-top: calc(8 * var(--asn-k)); /* topo, ~alinhado ao cap dos dígitos */
    font-family: var(--font-tpSans-exLight);
    font-weight: var(--fw-extralight);
    font-size: 120px;
    line-height: 1;
    color: var(--title-default); /* #010101 */
}

@media (prefers-reduced-motion: reduce) {
    .big-numbers .ast__bar {
        transition: none;
    }
}

/* ============================================================ ≤1024 — frame 992 ======== */
@media (max-width: 1024px) {
    .big-numbers .about-sticky {
        gap: 40px;
    }

    .big-numbers .asn {
        --asn-h: 176px;
    }

    .big-numbers .ast__title {
        font-size: 48px;
        line-height: 48px;
    }

    .big-numbers .ast__body p {
        font-size: 18px;
        line-height: 24px;
    }

    .big-numbers .ast__desc {
        font-size: 32px;
        line-height: 36px;
    }

    .big-numbers .ast__list {
        gap: 64px;
    }
}

/* ============================================================
   ≤768 — tablet/mobile: COLUNA ÚNICA e SEM sticky (pedido do usuário)
   ============================================================ */
@media (max-width: 768px) {
    .big-numbers .about-sticky {
        flex-direction: column;
        gap: 40px;
        padding: 40px;
    }

    .big-numbers .asn {
        --asn-h: 120px;
    }

    .big-numbers .ast__text {
        position: static; /* sem sticky em tablet/mobile */
        top: auto;
        flex: none;
        width: 100%;
    }

    .big-numbers .ast__list {
        flex: none;
        width: 100%;
        gap: 64px;
    }

    .big-numbers .ast__title {
        font-size: 40px;
        line-height: 40px;
    }

    .big-numbers .ast__item {
        gap: 24px;
    }

    .big-numbers .ast__desc {
        font-size: 24px;
        line-height: 24px;
    }
}

/* ============================================================ ≤680 — mobile ============ */
@media (max-width: 680px) {
    .big-numbers .about-sticky {
        padding: 40px 20px;
    }

    .big-numbers .asn {
        --asn-h: 88px;
    }
    /* = frame mobile 40000536:29969 */
    .big-numbers .ast__body p {
        font-size: 16px;
        line-height: 24px;
    }
}

@media (max-width: 767.98px) { /* a faixa do d-md-none */
    .big-numbers .asn:has(.kpi__icon-after-image.d-md-none) {
        padding-right: 40px; /* reserva o vão que o ícone ocupava "para fora" */
    }

    .big-numbers .asn .kpi__icon-after-image.d-md-none {
        right: 0; /* era right: -40px — agora ancora DENTRO da reserva */
        left: auto;
    }
}