/* ========================================================================
   DigiFULL — Clínica nas Nuvens — 03 Nuvem Pay 360
   Reveal por nuvens + cena 2.5D controlada por scroll.
======================================================================== */
.dgf-cnn-pay {
    position: relative;
    z-index: 8;
    margin-top: -1px;
    padding: 210px 0 128px;
    overflow: clip;
    background:
        radial-gradient(circle at 14% 8%, rgba(67,213,223,.11), transparent 27%),
        radial-gradient(circle at 86% 12%, rgba(245,130,31,.06), transparent 22%),
        linear-gradient(180deg, #FFFFFF 0%, #F7FBFA 22%, #FFFFFF 100%);
}

/* Lettering de fundo — não é badge e não participa da hierarquia semântica. */
.dgf-cnn-pay__background-title {
    position: absolute;
    z-index: 1;
    top: 46px;
    left: 50%;
    width: min(1420px, 96vw);
    transform: translateX(-50%);
    clip-path: inset(72% 0 0 0);
    color: rgba(16,33,63,.055);
    font-size: clamp(76px, 10.5vw, 168px);
    font-weight: 900;
    letter-spacing: -.065em;
    line-height: .9;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
}

.dgf-cnn-pay__background-title span {
    color: rgba(245,130,31,.10);
}

/* A nova seção não sobe sobre Números; as nuvens recuam e revelam seu fundo. */
.dgf-cnn-pay__reveal {
    position: absolute;
    z-index: 5;
    top: -118px;
    right: 0;
    left: 0;
    height: 300px;
    overflow: hidden;
    pointer-events: none;
    isolation: isolate;
}

.dgf-cnn-pay__reveal::after {
    content: "";
    position: absolute;
    z-index: 4;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 82px;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.74) 56%, #FFFFFF 100%);
}

.dgf-cnn-pay__cloud {
    position: absolute;
    inset: 0 -5vw -2px;
    will-change: transform, opacity;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.28) 10%, #000 33%, #000 100%);
    mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.28) 10%, #000 33%, #000 100%);
}

.dgf-cnn-pay__cloud img {
    position: absolute;
    left: 0;
    bottom: -9%;
    display: block;
    width: 100%;
    height: 152%;
    max-width: none;
    object-fit: cover;
    object-position: 50% 62%;
    user-select: none;
}

.dgf-cnn-pay__cloud--back {
    z-index: 1;
    opacity: .52;
    filter: blur(1.5px);
    transform: translate3d(-2%, 50px, 0) scale(1.08);
}

.dgf-cnn-pay__cloud--front {
    z-index: 2;
    opacity: 1;
    transform: translate3d(1%, 32px, 0) scale(1.025);
}

.dgf-cnn-pay__container {
    position: relative;
    z-index: 3;
}

.dgf-cnn-pay__layout {
    display: grid;
    grid-template-columns: minmax(0, .80fr) minmax(0, 1.20fr);
    gap: clamp(42px, 5vw, 76px);
    align-items: start;
}

.dgf-cnn-pay__copy {
    position: sticky;
    top: 15vh;
    padding-top: 8vh;
}

.dgf-cnn-pay__title {
    max-width: 540px;
    margin: 0;
    color: var(--dgf-color-ink);
    font-size: clamp(40px, 4.5vw, 58px);
    font-weight: 500;
    letter-spacing: -.04em;
    line-height: 1.05;
}

.dgf-cnn-pay__title span {
    color: var(--dgf-color-primary);
    font-weight: 800;
}

.dgf-cnn-pay__copy p {
    max-width: 570px;
    margin: 28px 0 0;
    color: var(--dgf-color-body);
    font-size: 17px;
    line-height: 1.68;
}

.dgf-cnn-pay__copy p + p {
    margin-top: 18px;
}

.dgf-cnn-pay__motion {
    position: relative;
    min-height: 260vh;
}

.dgf-cnn-pay__visual {
    position: sticky;
    top: 9vh;
    height: min(82vh, 760px);
    min-height: 620px;
    overflow: hidden;
    border: 1px solid rgba(125,168,255,.18);
    border-radius: 30px;
    background: linear-gradient(145deg, #061327 0%, #0B244B 58%, #071A37 100%);
    box-shadow: 0 38px 82px -42px rgba(6,19,39,.62);
    isolation: isolate;
}

.dgf-cnn-pay__visual::after {
    content: "";
    position: absolute;
    z-index: 10;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.025);
    pointer-events: none;
}

.dgf-cnn-pay__visual-grid {
    position: absolute;
    z-index: 0;
    inset: 0;
    opacity: .20;
    background-image:
        linear-gradient(rgba(125,168,255,.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(125,168,255,.12) 1px, transparent 1px);
    background-size: 38px 38px;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
}

.dgf-cnn-pay__visual-glow {
    position: absolute;
    z-index: 0;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    filter: blur(28px);
    pointer-events: none;
}

.dgf-cnn-pay__visual-glow--orange {
    left: -210px;
    bottom: -230px;
    background: rgba(245,130,31,.15);
}

.dgf-cnn-pay__visual-glow--cyan {
    top: -220px;
    right: -200px;
    background: rgba(67,213,223,.14);
}

.dgf-cnn-pay__visual-topline {
    position: absolute;
    z-index: 8;
    top: 28px;
    right: 32px;
    left: 32px;
    display: flex;
    align-items: center;
    gap: 18px;
    color: rgba(246,248,252,.52);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.dgf-cnn-pay__visual-topline i {
    flex: 1;
    height: 1px;
    background: rgba(125,168,255,.16);
}

.dgf-cnn-pay__scene {
    position: absolute;
    z-index: 3;
    top: 72px;
    right: 28px;
    bottom: 148px;
    left: 28px;
    perspective: 1200px;
}

.dgf-cnn-pay__platform {
    position: absolute;
    z-index: 0;
    top: 17%;
    left: 15%;
    width: 70%;
    height: 61%;
    border: 1px solid rgba(125,168,255,.20);
    background:
        linear-gradient(90deg, rgba(125,168,255,.06) 1px, transparent 1px),
        linear-gradient(rgba(125,168,255,.06) 1px, transparent 1px),
        linear-gradient(145deg, rgba(16,44,87,.62), rgba(6,19,39,.18));
    background-size: 24px 24px, 24px 24px, auto;
    transform: rotateX(62deg) rotateZ(-30deg);
    box-shadow: 28px 36px 64px rgba(0,0,0,.24);
}

.dgf-cnn-pay__flows {
    position: absolute;
    z-index: 1;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
}

.dgf-cnn-pay__flow {
    fill: none;
    stroke-width: 2.2;
    vector-effect: non-scaling-stroke;
}

.dgf-cnn-pay__flow--base {
    stroke: rgba(125,168,255,.16);
    stroke-dasharray: 5 8;
}

.dgf-cnn-pay__flow--active {
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    stroke-linecap: round;
    filter: drop-shadow(0 0 6px rgba(67,213,223,.34));
}

.dgf-cnn-pay__module {
    position: absolute;
    z-index: 4;
    width: 31%;
    min-width: 160px;
    opacity: .46;
    transform: scale(.91) translateY(8px);
    transform-origin: center center;
    will-change: transform, opacity;
}

.dgf-cnn-pay__module--agenda {
    top: 9%;
    left: 2%;
}

.dgf-cnn-pay__module--receive {
    top: 9%;
    right: 2%;
}

.dgf-cnn-pay__module--reconcile {
    bottom: 2%;
    left: 34.5%;
}

.dgf-cnn-pay__module-tilt {
    transform-style: preserve-3d;
    transform: rotateX(8deg) rotateY(-8deg);
    will-change: transform;
}

.dgf-cnn-pay__module--receive .dgf-cnn-pay__module-tilt {
    transform: rotateX(8deg) rotateY(8deg);
}

.dgf-cnn-pay__module--reconcile .dgf-cnn-pay__module-tilt {
    transform: rotateX(7deg) rotateY(-4deg);
}

.dgf-cnn-pay__module-face {
    position: relative;
    min-height: 176px;
    padding: 16px;
    border: 1px solid rgba(125,168,255,.23);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(16,44,87,.96), rgba(7,21,45,.98));
    box-shadow: 0 24px 44px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.035);
}

.dgf-cnn-pay__module-face::before,
.dgf-cnn-pay__module-face::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.dgf-cnn-pay__module-face::before {
    right: 8px;
    bottom: -8px;
    left: 8px;
    height: 8px;
    border-radius: 0 0 12px 12px;
    background: #041022;
    transform: skewX(-38deg);
    transform-origin: top;
    opacity: .72;
}

.dgf-cnn-pay__module-head {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #F6F8FC;
}

.dgf-cnn-pay__module-index {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 1px solid rgba(245,130,31,.46);
    border-radius: 50%;
    color: #FFB779;
    font-size: 9px;
    font-weight: 900;
}

.dgf-cnn-pay__module-head strong {
    font-size: 14px;
    letter-spacing: -.01em;
}

/* Agenda */
.dgf-cnn-pay__calendar {
    position: relative;
    margin-top: 18px;
    padding: 13px;
    border: 1px solid rgba(125,168,255,.18);
    border-radius: 13px;
    background: rgba(3,16,34,.54);
}

.dgf-cnn-pay__calendar-top {
    display: flex;
    justify-content: space-between;
    padding-bottom: 9px;
    border-bottom: 1px solid rgba(125,168,255,.15);
}

.dgf-cnn-pay__calendar-top i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #F5821F;
    box-shadow: 0 0 10px rgba(245,130,31,.56);
}

.dgf-cnn-pay__calendar-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
    margin-top: 10px;
}

.dgf-cnn-pay__calendar-grid span {
    height: 11px;
    border-radius: 3px;
    background: rgba(125,168,255,.13);
}

.dgf-cnn-pay__slot {
    position: absolute;
    right: 10px;
    bottom: 9px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 7px;
    border: 1px solid rgba(245,130,31,.28);
    border-radius: 6px;
    background: rgba(245,130,31,.12);
    color: #FFFFFF;
    opacity: .46;
    transform: translateY(6px);
}

.dgf-cnn-pay__slot b {
    color: #FFB779;
    font-size: 8px;
}

.dgf-cnn-pay__slot em {
    color: rgba(255,255,255,.72);
    font-size: 7px;
    font-style: normal;
}

/* Receba */
.dgf-cnn-pay__payment {
    position: relative;
    height: 112px;
    margin-top: 18px;
}

.dgf-cnn-pay__payment-card {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 74%;
    height: 68px;
    padding: 12px;
    border: 1px solid rgba(67,213,223,.26);
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(67,213,223,.18), rgba(125,168,255,.12));
    transform: rotate(-5deg);
}

.dgf-cnn-pay__payment-card span {
    display: block;
    width: 44%;
    height: 5px;
    margin-bottom: 7px;
    border-radius: 3px;
    background: rgba(255,255,255,.20);
}

.dgf-cnn-pay__payment-card strong {
    position: absolute;
    right: 12px;
    bottom: 10px;
    color: #43D5DF;
    font-size: 20px;
}

.dgf-cnn-pay__coin {
    position: absolute;
    z-index: 2;
    top: 17px;
    right: 6px;
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 2px solid rgba(245,130,31,.54);
    border-radius: 50%;
    color: #FFB779;
    background: #0A1D3A;
    box-shadow: 0 0 20px rgba(245,130,31,.16);
    font-size: 17px;
    font-weight: 900;
}

.dgf-cnn-pay__payment-meter {
    position: absolute;
    right: 7px;
    bottom: 5px;
    left: 7px;
    height: 5px;
    overflow: hidden;
    border-radius: 99px;
    background: rgba(125,168,255,.12);
}

.dgf-cnn-pay__payment-meter i {
    display: block;
    width: 18%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #43D5DF, #7DA8FF);
}

/* Concilie */
.dgf-cnn-pay__reconcile {
    position: relative;
    height: 112px;
    margin-top: 18px;
}

.dgf-cnn-pay__match {
    position: absolute;
    top: 11px;
    width: 43%;
    padding: 10px;
    border: 1px solid rgba(125,168,255,.18);
    border-radius: 10px;
    background: rgba(3,16,34,.55);
}

.dgf-cnn-pay__match--left { left: 0; }
.dgf-cnn-pay__match--right { right: 0; }

.dgf-cnn-pay__match small,
.dgf-cnn-pay__match b {
    display: block;
}

.dgf-cnn-pay__match small {
    color: rgba(185,198,216,.62);
    font-size: 7px;
    text-transform: uppercase;
}

.dgf-cnn-pay__match b {
    margin-top: 5px;
    color: #FFFFFF;
    font-size: 12px;
}

.dgf-cnn-pay__check {
    position: absolute;
    z-index: 3;
    bottom: 2px;
    left: 50%;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(119,228,166,.36);
    border-radius: 50%;
    color: #77E4A6;
    background: #0A1D3A;
    box-shadow: 0 0 24px rgba(119,228,166,.14);
    opacity: .18;
    transform: translateX(-50%) scale(.72);
}

.dgf-cnn-pay__check svg { width: 20px; height: 20px; }

/* Steps inferiores */
.dgf-cnn-pay__steps {
    position: absolute;
    z-index: 6;
    right: 36px;
    bottom: 82px;
    left: 36px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.dgf-cnn-pay__steps > i {
    width: min(72px, 9vw);
    height: 1px;
    margin-top: 16px;
    background: rgba(125,168,255,.20);
}

.dgf-cnn-pay__step {
    display: grid;
    min-width: 78px;
    justify-items: center;
    gap: 7px;
    color: rgba(185,198,216,.42);
}

.dgf-cnn-pay__step span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid rgba(125,168,255,.24);
    border-radius: 50%;
    color: inherit;
    font-size: 9px;
    font-weight: 900;
}

.dgf-cnn-pay__step strong {
    font-size: 10px;
    font-weight: 800;
}

.dgf-cnn-pay__caption {
    position: absolute;
    z-index: 6;
    right: 32px;
    bottom: 24px;
    left: 32px;
    display: grid;
    grid-template-columns: 3px 1fr;
    gap: 14px;
    align-items: stretch;
    min-height: 38px;
    padding: 10px 14px 10px 0;
    background: rgba(255,255,255,.035);
}

.dgf-cnn-pay__caption span {
    background: var(--dgf-color-primary);
}

.dgf-cnn-pay__caption p {
    margin: 0;
    color: rgba(246,248,252,.65);
    font-size: 12px;
    line-height: 1.5;
}

@media (max-width: 960px) {
    .dgf-cnn-pay {
        padding-top: 190px;
    }

    .dgf-cnn-pay__layout {
        grid-template-columns: 1fr;
        gap: 46px;
    }

    .dgf-cnn-pay__copy {
        position: relative;
        top: auto;
        padding-top: 0;
    }

    .dgf-cnn-pay__title,
    .dgf-cnn-pay__copy p {
        max-width: 700px;
    }

    .dgf-cnn-pay__motion {
        min-height: 230vh;
    }

    .dgf-cnn-pay__visual {
        top: 10vh;
        height: min(78vh, 700px);
    }
}

@media (max-width: 640px) {
    .dgf-cnn-pay {
        padding: 142px 0 78px;
    }

    .dgf-cnn-pay__reveal {
        top: -72px;
        height: 200px;
    }

    .dgf-cnn-pay__reveal::after {
        height: 58px;
    }

    .dgf-cnn-pay__cloud {
        inset: 0 -27vw -2px;
    }

    .dgf-cnn-pay__cloud img {
        bottom: -27%;
        width: 152%;
        height: 174%;
        object-position: 50% 68%;
    }

    .dgf-cnn-pay__background-title {
        top: 38px;
        width: calc(100% - 28px);
        font-size: clamp(52px, 16vw, 76px);
        letter-spacing: -.055em;
        white-space: normal;
        line-height: .9;
    }

    .dgf-cnn-pay__layout {
        gap: 34px;
    }

    .dgf-cnn-pay__title {
        font-size: clamp(34px, 9.4vw, 44px);
        line-height: 1.03;
    }

    .dgf-cnn-pay__copy p {
        margin-top: 20px;
        font-size: 15px;
        line-height: 1.62;
    }

    .dgf-cnn-pay__copy p + p {
        margin-top: 15px;
    }

    .dgf-cnn-pay__motion {
        min-height: 245vh;
    }

    .dgf-cnn-pay__visual {
        top: 10vh;
        height: 72vh;
        min-height: 520px;
        border-radius: 24px;
    }

    .dgf-cnn-pay__visual-topline {
        top: 22px;
        right: 20px;
        left: 20px;
        font-size: 9px;
    }

    .dgf-cnn-pay__scene {
        top: 62px;
        right: 12px;
        bottom: 150px;
        left: 12px;
    }

    .dgf-cnn-pay__platform {
        top: 18%;
        left: 7%;
        width: 86%;
        height: 62%;
    }

    .dgf-cnn-pay__module {
        width: 39%;
        min-width: 0;
    }

    .dgf-cnn-pay__module--agenda { top: 10%; left: 0; }
    .dgf-cnn-pay__module--receive { top: 10%; right: 0; }
    .dgf-cnn-pay__module--reconcile { bottom: 4%; left: 30.5%; }

    .dgf-cnn-pay__module-face {
        min-height: 158px;
        padding: 12px;
        border-radius: 15px;
    }

    .dgf-cnn-pay__module-index {
        width: 25px;
        height: 25px;
        font-size: 8px;
    }

    .dgf-cnn-pay__module-head strong { font-size: 12px; }
    .dgf-cnn-pay__calendar { margin-top: 14px; padding: 10px; }
    .dgf-cnn-pay__slot { display: none; }
    .dgf-cnn-pay__payment { height: 102px; margin-top: 14px; }
    .dgf-cnn-pay__coin { width: 36px; height: 36px; font-size: 14px; }
    .dgf-cnn-pay__reconcile { height: 102px; margin-top: 14px; }
    .dgf-cnn-pay__match { padding: 7px; }
    .dgf-cnn-pay__match b { font-size: 10px; }
    .dgf-cnn-pay__check { width: 34px; height: 34px; }

    .dgf-cnn-pay__steps {
        right: 12px;
        bottom: 82px;
        left: 12px;
    }

    .dgf-cnn-pay__steps > i {
        width: 32px;
    }

    .dgf-cnn-pay__step {
        min-width: 70px;
    }

    .dgf-cnn-pay__caption {
        right: 18px;
        bottom: 20px;
        left: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgf-cnn-pay__copy,
    .dgf-cnn-pay__visual {
        position: relative;
        top: auto;
    }

    .dgf-cnn-pay__motion {
        min-height: 0;
    }

    .dgf-cnn-pay__background-title {
        clip-path: inset(0);
    }

    .dgf-cnn-pay__cloud--back {
        transform: translate3d(-2%, -46px, 0) scale(1.04);
        opacity: .18;
    }

    .dgf-cnn-pay__cloud--front {
        transform: translate3d(1%, -64px, 0) scale(1.01);
        opacity: .24;
    }

    .dgf-cnn-pay__module {
        opacity: .92;
        transform: none;
    }

    .dgf-cnn-pay__flow--active {
        stroke-dashoffset: 0;
    }

    .dgf-cnn-pay__slot,
    .dgf-cnn-pay__check {
        opacity: 1;
        transform: none;
    }
}

/* ========================================================================
   v1.1.1 — reveal real por nuvens + título sincronizado + fechamento 360
   Mantém a cena 2.5D existente; altera somente a entrada e os estados.
======================================================================== */
.dgf-cnn-pay {
    padding-top: 250px;
    background:
        radial-gradient(circle at 14% 4%, rgba(67,213,223,.14), transparent 28%),
        radial-gradient(circle at 88% 8%, rgba(245,130,31,.07), transparent 22%),
        linear-gradient(180deg, #EEF8FB 0%, #F7FBFA 20%, #FFFFFF 42%, #FFFFFF 100%);
}

.dgf-cnn-pay__reveal {
    z-index: 9;
    top: -185px;
    height: 445px;
    overflow: hidden;
    background: linear-gradient(180deg, rgba(230,244,249,.96) 0%, rgba(240,248,250,.76) 46%, rgba(255,255,255,0) 100%);
}

.dgf-cnn-pay__reveal::after {
    z-index: 6;
    height: 96px;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(247,251,250,.66) 54%, #F7FBFA 100%);
}

.dgf-cnn-pay__cloud {
    inset: 0 -7vw -2px;
    -webkit-mask-image: none;
    mask-image: none;
}

.dgf-cnn-pay__cloud img {
    bottom: -4%;
    width: 114%;
    height: 108%;
    object-fit: cover;
    object-position: 50% 72%;
    filter: contrast(1.12) brightness(.975) saturate(.82);
}

.dgf-cnn-pay__cloud--back {
    opacity: .82;
    filter: blur(1.2px);
    transform: translate3d(-3%, 18px, 0) scale(1.08);
}

.dgf-cnn-pay__cloud--front {
    opacity: 1;
    transform: translate3d(2%, 38px, 0) scale(1.035);
}

.dgf-cnn-pay__background-title {
    z-index: 2;
    top: 42px;
    color: rgba(16,33,63,.07);
}

.dgf-cnn-pay__background-title span {
    color: rgba(245,130,31,.14);
}

/* O texto principal acompanha o estado da animação. */
.dgf-cnn-pay__title-lead {
    display: block;
    color: var(--dgf-color-ink);
    font-weight: 500;
}

.dgf-cnn-pay__title-action,
.dgf-cnn-pay__title-join {
    display: inline;
}

.dgf-cnn-pay__title-action {
    color: rgba(245,130,31,.28);
    font-weight: 850;
    transition: color .25s ease, opacity .25s ease, text-shadow .25s ease;
}

.dgf-cnn-pay__title-join {
    color: rgba(16,33,63,.42);
    font-weight: 500;
}

/* Holograma 360 que fecha o ciclo. */
.dgf-cnn-pay__core360 {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 50%;
    display: grid;
    width: 132px;
    height: 132px;
    place-items: center;
    align-content: center;
    border: 1px solid rgba(67,213,223,.30);
    border-radius: 50%;
    color: #FFFFFF;
    background:
        radial-gradient(circle at center, rgba(67,213,223,.28) 0%, rgba(27,88,164,.18) 42%, rgba(5,23,50,.20) 70%, rgba(5,23,50,0) 72%),
        rgba(6,19,39,.28);
    box-shadow:
        0 0 0 10px rgba(67,213,223,.035),
        0 0 44px rgba(67,213,223,.20),
        inset 0 0 28px rgba(67,213,223,.10);
    opacity: 0;
    transform: translate(-50%, -50%) scale(.58);
    transform-origin: center center;
    pointer-events: none;
}

.dgf-cnn-pay__core360::before,
.dgf-cnn-pay__core360::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(125,168,255,.18);
}

.dgf-cnn-pay__core360::before {
    inset: -18px;
}

.dgf-cnn-pay__core360::after {
    inset: -34px;
    border-style: dashed;
    border-color: rgba(245,130,31,.20);
}

.dgf-cnn-pay__core360 span {
    display: block;
    color: #FFFFFF;
    font-size: 42px;
    font-weight: 900;
    letter-spacing: -.055em;
    line-height: .9;
    text-shadow: 0 0 18px rgba(67,213,223,.55);
}

.dgf-cnn-pay__core360 small {
    display: block;
    margin-top: 7px;
    color: rgba(246,248,252,.58);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

@media (max-width: 960px) {
    .dgf-cnn-pay {
        padding-top: 230px;
    }
}

@media (max-width: 640px) {
    .dgf-cnn-pay {
        padding: 205px 0 78px;
        background:
            radial-gradient(circle at 18% 3%, rgba(67,213,223,.15), transparent 29%),
            linear-gradient(180deg, #EDF8FB 0%, #F8FBFA 24%, #FFFFFF 46%, #FFFFFF 100%);
    }

    .dgf-cnn-pay__reveal {
        top: -128px;
        height: 330px;
        background: linear-gradient(180deg, rgba(225,242,248,.98) 0%, rgba(242,249,250,.82) 56%, rgba(255,255,255,0) 100%);
    }

    .dgf-cnn-pay__reveal::after {
        height: 72px;
    }

    .dgf-cnn-pay__cloud {
        inset: 0 -48vw -2px;
    }

    .dgf-cnn-pay__cloud img {
        left: -2%;
        bottom: -3%;
        width: 190%;
        height: 116%;
        object-position: 50% 72%;
        filter: contrast(1.14) brightness(.97) saturate(.82);
    }

    .dgf-cnn-pay__cloud--back {
        opacity: .80;
        transform: translate3d(-5%, 18px, 0) scale(1.08);
    }

    .dgf-cnn-pay__cloud--front {
        opacity: 1;
        transform: translate3d(2%, 34px, 0) scale(1.035);
    }

    .dgf-cnn-pay__background-title {
        top: 22px;
        font-size: clamp(48px, 15.2vw, 70px);
        color: rgba(16,33,63,.07);
    }

    .dgf-cnn-pay__title {
        max-width: 100%;
    }

    .dgf-cnn-pay__title-lead {
        margin-bottom: 2px;
    }

    .dgf-cnn-pay__motion {
        min-height: 255vh;
    }

    .dgf-cnn-pay__visual {
        top: 9vh;
        height: 76vh;
        min-height: 560px;
    }

    .dgf-cnn-pay__scene {
        top: 64px;
        bottom: 142px;
    }

    .dgf-cnn-pay__module {
        width: 42%;
    }

    .dgf-cnn-pay__module--agenda { top: 6%; left: 1%; }
    .dgf-cnn-pay__module--receive { top: 6%; right: 1%; }
    .dgf-cnn-pay__module--reconcile { bottom: 2%; left: 29%; }

    .dgf-cnn-pay__core360 {
        top: 52%;
        width: 102px;
        height: 102px;
    }

    .dgf-cnn-pay__core360 span {
        font-size: 34px;
    }

    .dgf-cnn-pay__core360 small {
        font-size: 6px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgf-cnn-pay__core360 {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }

    .dgf-cnn-pay__title-action {
        color: var(--dgf-color-primary);
    }
}

/* Corrige a regra legada `.dgf-cnn-pay__title span`. */
.dgf-cnn-pay__title .dgf-cnn-pay__title-lead {
    color: var(--dgf-color-ink);
    font-weight: 500;
}

.dgf-cnn-pay__title .dgf-cnn-pay__title-action {
    color: rgba(245,130,31,.28);
    font-weight: 850;
}

.dgf-cnn-pay__title .dgf-cnn-pay__title-join {
    color: rgba(16,33,63,.42);
    font-weight: 500;
}

/* ========================================================================
   v1.1.3 — reveal físico correto: Números reais sai da frente e descobre Pay
======================================================================== */
.dgf-cnn-pay {
    position: relative;
    z-index: 4;
    margin-top: -210px;
    padding: 390px 0 128px;
    overflow: visible;
    background:
        radial-gradient(circle at 12% 6%, rgba(67,213,223,.13), transparent 29%),
        radial-gradient(circle at 91% 7%, rgba(245,130,31,.06), transparent 22%),
        linear-gradient(180deg, #EEF8FB 0%, #F7FBFA 22%, #FFFFFF 48%, #FFFFFF 100%);
}

/* Não existem nuvens na seção 03. Elas pertencem exclusivamente à seção 02. */
.dgf-cnn-pay__reveal,
.dgf-cnn-pay__cloud,
.dgf-cnn-pay__underlay {
    display: none !important;
}

/* Área que já está por baixo do bottom de Números reais. */
.dgf-cnn-pay__reveal-name {
    position: absolute;
    z-index: 0;
    top: 0;
    right: 0;
    left: 0;
    height: 310px;
    overflow: hidden;
    pointer-events: none;
    background:
        radial-gradient(circle at 14% 34%, rgba(67,213,223,.10), transparent 31%),
        radial-gradient(circle at 86% 26%, rgba(245,130,31,.045), transparent 26%);
}

.dgf-cnn-pay__background-title {
    position: absolute;
    z-index: 0;
    top: 58px;
    left: 50%;
    width: min(1200px, calc(100% - 48px));
    transform: translateX(-50%);
    clip-path: none;
    color: rgba(16,33,63,.105);
    font-size: clamp(82px, 10vw, 152px);
    font-weight: 900;
    letter-spacing: -.065em;
    line-height: .86;
    white-space: nowrap;
    opacity: 1;
    pointer-events: none;
    user-select: none;
}

.dgf-cnn-pay__background-title span {
    color: rgba(245,130,31,.19);
}

.dgf-cnn-pay__container {
    position: relative;
    z-index: 2;
}

.dgf-cnn-pay__layout {
    grid-template-columns: minmax(0, .82fr) minmax(520px, 1.18fr);
    gap: clamp(42px, 4.6vw, 66px);
    align-items: start;
}

.dgf-cnn-pay__copy {
    position: sticky;
    top: 13vh;
    padding-top: 6vh;
}

.dgf-cnn-pay__title {
    max-width: 575px;
    font-size: clamp(42px, 4vw, 54px);
    line-height: 1.02;
    text-wrap: balance;
}

.dgf-cnn-pay__title-lead {
    display: block;
    margin-bottom: 10px;
}

.dgf-cnn-pay__title-action-row {
    display: block;
    max-width: 600px;
    color: inherit;
    font: inherit;
    line-height: 1.02;
}

.dgf-cnn-pay__title-action,
.dgf-cnn-pay__title-join {
    display: inline;
}

.dgf-cnn-pay__title-action {
    color: rgba(245,130,31,.30);
    font-weight: 850;
}

.dgf-cnn-pay__title-join {
    color: rgba(16,33,63,.44);
    font-weight: 500;
}

.dgf-cnn-pay__copy p {
    max-width: 555px;
    margin-top: 24px;
    font-size: 16px;
    line-height: 1.68;
}

.dgf-cnn-pay__copy p + p {
    margin-top: 16px;
}

/* O palco mantém a animação existente, apenas recebe proporção mais limpa. */
.dgf-cnn-pay__visual {
    height: min(78vh, 710px);
    min-height: 600px;
}

.dgf-cnn-pay__motion {
    min-height: 248vh;
}

@media (max-width: 960px) {
    .dgf-cnn-pay {
        margin-top: -180px;
        padding-top: 340px;
    }

    .dgf-cnn-pay__reveal-name {
        height: 270px;
    }

    .dgf-cnn-pay__background-title {
        top: 52px;
        width: calc(100% - 48px);
        font-size: clamp(72px, 11.5vw, 116px);
    }

    .dgf-cnn-pay__layout {
        grid-template-columns: 1fr;
        gap: 44px;
    }

    .dgf-cnn-pay__copy {
        position: relative;
        top: auto;
        padding-top: 0;
    }

    .dgf-cnn-pay__title,
    .dgf-cnn-pay__copy p {
        max-width: 700px;
    }
}

@media (max-width: 640px) {
    .dgf-cnn-pay {
        margin-top: -138px;
        padding: 274px 0 78px;
        background:
            radial-gradient(circle at 15% 5%, rgba(67,213,223,.14), transparent 31%),
            linear-gradient(180deg, #EDF8FB 0%, #F8FBFA 26%, #FFFFFF 52%, #FFFFFF 100%);
    }

    .dgf-cnn-pay__reveal-name {
        height: 218px;
    }

    .dgf-cnn-pay__background-title {
        top: 28px;
        width: calc(100% - 28px);
        font-size: clamp(54px, 15.2vw, 72px);
        line-height: .88;
        white-space: normal;
        color: rgba(16,33,63,.095);
    }

    .dgf-cnn-pay__background-title span {
        color: rgba(245,130,31,.18);
    }

    .dgf-cnn-pay__layout {
        gap: 32px;
    }

    .dgf-cnn-pay__title {
        max-width: 100%;
        font-size: clamp(33px, 8.7vw, 42px);
        line-height: 1.02;
    }

    .dgf-cnn-pay__title-lead {
        margin-bottom: 7px;
    }

    .dgf-cnn-pay__title-action-row {
        max-width: 100%;
        line-height: 1.01;
    }

    .dgf-cnn-pay__copy p {
        margin-top: 19px;
        font-size: 14.5px;
        line-height: 1.6;
    }

    .dgf-cnn-pay__copy p + p {
        margin-top: 14px;
    }

    .dgf-cnn-pay__motion {
        min-height: 238vh;
    }

    .dgf-cnn-pay__visual {
        top: 8vh;
        height: 74vh;
        min-height: 540px;
        border-radius: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dgf-cnn-pay {
        margin-top: 0;
        padding-top: 190px;
    }

    .dgf-cnn-pay__reveal-name {
        height: 170px;
    }

    .dgf-cnn-pay__title-action,
    .dgf-cnn-pay__title-join {
        color: var(--dgf-color-primary);
    }
}

/* ========================================================================
   v1.1.4 — reveal estrutural verdadeiro
   A seção Pay inteira fica sticky atrás de Números reais por 1 viewport.
   Números + nuvens saem para cima e descobrem o painel completo.
======================================================================== */
.dgf-cnn-pay {
    --dgf-cnn-pay-reveal-distance: 100svh;
    position: relative;
    z-index: 4;
    margin-top: 0;
    min-height: 390svh;
    padding: 0;
    overflow: visible;
    background: transparent;
}

#digifull-cnn-page > .dgf-cnn-pay {
    margin-top: calc(-1 * var(--dgf-cnn-pay-reveal-distance));
}

.dgf-cnn-pay__sticky {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100svh;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(circle at 13% 12%, rgba(67,213,223,.13), transparent 30%),
        radial-gradient(circle at 88% 14%, rgba(245,130,31,.065), transparent 23%),
        linear-gradient(180deg, #EEF8FB 0%, #F7FBFA 38%, #FFFFFF 100%);
}

/* Toda nuvem da seção 03 é proibida: as nuvens pertencem à seção 02. */
.dgf-cnn-pay__reveal,
.dgf-cnn-pay__cloud,
.dgf-cnn-pay__underlay {
    display: none !important;
}

.dgf-cnn-pay__reveal-name {
    position: absolute;
    z-index: 0;
    inset: 0 0 auto;
    height: 26svh;
    min-height: 160px;
    overflow: hidden;
    pointer-events: none;
    background: transparent;
}

.dgf-cnn-pay__background-title {
    position: absolute;
    top: 4.5svh;
    left: 50%;
    width: min(1200px, calc(100% - 48px));
    transform: translateX(-50%);
    clip-path: none;
    opacity: 1;
    color: rgba(16,33,63,.072);
    font-size: clamp(84px, 10.2vw, 154px);
    font-weight: 900;
    letter-spacing: -.065em;
    line-height: .86;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
}

.dgf-cnn-pay__background-title span {
    color: rgba(245,130,31,.14);
}

.dgf-cnn-pay__container {
    position: relative;
    z-index: 2;
    height: 100%;
}

.dgf-cnn-pay__layout {
    display: grid;
    grid-template-columns: minmax(0, .82fr) minmax(520px, 1.18fr);
    gap: clamp(36px, 4.5vw, 64px);
    align-items: center;
    height: 100%;
    padding-top: clamp(122px, 17svh, 168px);
    padding-bottom: clamp(26px, 4svh, 44px);
}

.dgf-cnn-pay__copy {
    position: relative;
    top: auto;
    align-self: center;
    padding: 0;
}

.dgf-cnn-pay__title {
    max-width: 610px;
    margin: 0;
    color: var(--dgf-color-ink);
    font-size: clamp(40px, 3.65vw, 52px);
    font-weight: 500;
    letter-spacing: -.04em;
    line-height: 1.02;
    text-wrap: balance;
}

.dgf-cnn-pay__title-lead {
    display: block;
    margin-bottom: 9px;
    color: var(--dgf-color-ink);
    font-weight: 500;
}

.dgf-cnn-pay__title-action-row {
    display: block;
    max-width: 610px;
    line-height: 1.01;
}

.dgf-cnn-pay__title-action,
.dgf-cnn-pay__title-join {
    display: inline;
}

.dgf-cnn-pay__title-break {
    display: block;
}

.dgf-cnn-pay__title-action {
    color: rgba(245,130,31,.24);
    font-weight: 850;
}

.dgf-cnn-pay__title-join {
    color: rgba(16,33,63,.38);
    font-weight: 500;
}

.dgf-cnn-pay__copy p {
    max-width: 555px;
    margin: 20px 0 0;
    color: var(--dgf-color-body);
    font-size: 15px;
    line-height: 1.58;
}

.dgf-cnn-pay__copy p + p {
    margin-top: 13px;
}

/* A animação usa o scroll da própria seção; não precisa de outro sticky. */
.dgf-cnn-pay__motion {
    position: relative;
    min-height: 0;
    height: min(70svh, 690px);
    align-self: center;
}

.dgf-cnn-pay__visual {
    position: relative;
    top: auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    border-radius: 28px;
}

.dgf-cnn-pay__core360 {
    z-index: 7;
}

@media (max-width: 960px) {
    .dgf-cnn-pay {
        min-height: 410svh;
        padding: 0;
    }

    .dgf-cnn-pay__background-title {
        top: 3.5svh;
        width: calc(100% - 36px);
        font-size: clamp(68px, 11.5vw, 112px);
    }

    .dgf-cnn-pay__layout {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        gap: 22px;
        align-items: start;
        padding-top: clamp(112px, 15svh, 145px);
        padding-bottom: 24px;
    }

    .dgf-cnn-pay__copy {
        align-self: start;
    }

    .dgf-cnn-pay__title,
    .dgf-cnn-pay__copy p {
        max-width: 760px;
    }

    .dgf-cnn-pay__motion {
        width: 100%;
        height: min(55svh, 560px);
    }
}

@media (max-width: 640px) {
    .dgf-cnn-pay {
        --dgf-cnn-pay-reveal-distance: 100svh;
        min-height: 430svh;
        padding: 0;
    }

    .dgf-cnn-pay__sticky {
        height: 100svh;
        min-height: 620px;
    }

    .dgf-cnn-pay__reveal-name {
        height: 21svh;
        min-height: 118px;
    }

    .dgf-cnn-pay__background-title {
        top: 2.5svh;
        width: calc(100% - 28px);
        font-size: clamp(50px, 14.5vw, 70px);
        line-height: .88;
        white-space: normal;
        color: rgba(16,33,63,.075);
    }

    .dgf-cnn-pay__background-title span {
        color: rgba(245,130,31,.14);
    }

    .dgf-cnn-pay__layout {
        gap: 14px;
        padding-top: clamp(98px, 14svh, 122px);
        padding-bottom: 14px;
    }

    .dgf-cnn-pay__title {
        max-width: 100%;
        font-size: clamp(29px, 8.2vw, 38px);
        line-height: 1.01;
    }

    .dgf-cnn-pay__title-lead {
        margin-bottom: 5px;
    }

    .dgf-cnn-pay__title-action-row {
        max-width: 100%;
    }

    .dgf-cnn-pay__copy p {
        max-width: 100%;
        margin-top: 12px;
        font-size: 12.8px;
        line-height: 1.46;
    }

    .dgf-cnn-pay__copy p + p {
        margin-top: 8px;
    }

    .dgf-cnn-pay__motion {
        height: clamp(286px, 41svh, 350px);
    }

    .dgf-cnn-pay__visual {
        height: 100%;
        min-height: 0;
        border-radius: 21px;
    }

    .dgf-cnn-pay__visual-topline {
        top: 16px;
        right: 16px;
        left: 16px;
        font-size: 8px;
    }

    .dgf-cnn-pay__scene {
        top: 50px;
        right: 8px;
        bottom: 92px;
        left: 8px;
    }

    .dgf-cnn-pay__platform {
        top: 16%;
        left: 7%;
        width: 86%;
        height: 62%;
    }

    .dgf-cnn-pay__module {
        width: 40%;
        min-width: 0;
    }

    .dgf-cnn-pay__module--agenda { top: 5%; left: 0; }
    .dgf-cnn-pay__module--receive { top: 5%; right: 0; }
    .dgf-cnn-pay__module--reconcile { bottom: 0; left: 30%; }

    .dgf-cnn-pay__module-face {
        min-height: 118px;
        padding: 9px;
        border-radius: 13px;
    }

    .dgf-cnn-pay__module-index {
        width: 21px;
        height: 21px;
        font-size: 7px;
    }

    .dgf-cnn-pay__module-head strong {
        font-size: 10px;
    }

    .dgf-cnn-pay__calendar {
        margin-top: 9px;
        padding: 7px;
    }

    .dgf-cnn-pay__calendar-grid {
        gap: 3px;
        margin-top: 7px;
    }

    .dgf-cnn-pay__calendar-grid span {
        height: 7px;
    }

    .dgf-cnn-pay__slot {
        display: none;
    }

    .dgf-cnn-pay__payment,
    .dgf-cnn-pay__reconcile {
        height: 72px;
        margin-top: 8px;
    }

    .dgf-cnn-pay__coin {
        width: 29px;
        height: 29px;
        font-size: 11px;
    }

    .dgf-cnn-pay__match {
        padding: 5px;
    }

    .dgf-cnn-pay__match small {
        font-size: 6px;
    }

    .dgf-cnn-pay__match b {
        font-size: 8px;
    }

    .dgf-cnn-pay__check {
        width: 28px;
        height: 28px;
    }

    .dgf-cnn-pay__steps {
        right: 8px;
        bottom: 52px;
        left: 8px;
    }

    .dgf-cnn-pay__steps > i {
        width: 22px;
    }

    .dgf-cnn-pay__step {
        min-width: 56px;
    }

    .dgf-cnn-pay__step span {
        width: 23px;
        height: 23px;
        font-size: 7px;
    }

    .dgf-cnn-pay__step strong {
        font-size: 8px;
    }

    .dgf-cnn-pay__caption {
        right: 12px;
        bottom: 12px;
        left: 12px;
        padding: 8px 10px;
    }

    .dgf-cnn-pay__caption p {
        font-size: 8px;
        line-height: 1.25;
    }

    .dgf-cnn-pay__core360 {
        top: 50%;
        width: 82px;
        height: 82px;
    }

    .dgf-cnn-pay__core360 span {
        font-size: 29px;
    }

    .dgf-cnn-pay__core360 small {
        margin-top: 4px;
        font-size: 5px;
    }
}

@media (max-width: 640px) and (max-height: 700px) {
    .dgf-cnn-pay__layout {
        padding-top: 84px;
        gap: 9px;
    }

    .dgf-cnn-pay__background-title {
        font-size: 48px;
    }

    .dgf-cnn-pay__title {
        font-size: 28px;
    }

    .dgf-cnn-pay__copy p {
        margin-top: 8px;
        font-size: 11.8px;
        line-height: 1.38;
    }

    .dgf-cnn-pay__copy p + p {
        margin-top: 6px;
    }

    .dgf-cnn-pay__motion {
        height: 278px;
    }
}

@media (prefers-reduced-motion: reduce) {
    #digifull-cnn-page > .dgf-cnn-pay {
        margin-top: 0;
    }

    .dgf-cnn-pay {
        min-height: auto;
    }

    .dgf-cnn-pay__sticky {
        position: relative;
        height: auto;
        min-height: 100svh;
    }

    .dgf-cnn-pay__layout {
        min-height: 100svh;
    }
}

/* ========================================================================
   v1.1.5 — refinamentos de composição
======================================================================== */
/* Desktop: sobe o núcleo final para afastá-lo do card Concilie. */
@media (min-width: 961px) {
    .dgf-cnn-pay__core360 {
        top: 41.5%;
    }
}

/* Mobile: lettering de background em uma única linha, com zona própria. */
@media (max-width: 640px) {
    .dgf-cnn-pay__reveal-name {
        height: 96px;
        min-height: 96px;
    }

    .dgf-cnn-pay__background-title {
        top: 16px;
        width: calc(100% - 28px);
        font-size: clamp(40px, 11.2vw, 48px);
        line-height: .92;
        white-space: nowrap;
        letter-spacing: -.055em;
    }

    .dgf-cnn-pay__layout {
        padding-top: clamp(116px, 16svh, 138px);
    }
}

@media (max-width: 640px) and (max-height: 700px) {
    .dgf-cnn-pay__background-title {
        top: 12px;
        font-size: 40px;
    }

    .dgf-cnn-pay__layout {
        padding-top: 106px;
    }
}

/* ========================================================================
   v1.5.8 — ajuste fino do enquadramento sob header sticky/fixed
   O palco continua preenchendo top:0 (sem criar faixa vazia). O lettering
   decorativo sobe discretamente e somente o card 2.5D desce alguns pixels.
======================================================================== */
.dgf-cnn-pay {
    --dgf-cnn-site-header-offset: 0px;
}

.dgf-cnn-pay__sticky {
    top: 0;
    height: 100svh;
}

.dgf-cnn-pay__container {
    height: 100%;
}

/* Mantém o nome fora do header, com apenas 4px de respiro. Isso o traz para
   cima em relação à v1.5.7 sem voltar a deixá-lo cortado. */
.dgf-cnn-pay__background-title {
    top: max(4.5svh, calc(var(--dgf-cnn-site-header-offset, 0px) + 4px));
}

/* Não usar o header para aumentar o padding do palco: essa reserva global era
   percebida como uma faixa vazia no topo da seção. */
.dgf-cnn-pay__layout {
    padding-top: clamp(122px, 17svh, 168px);
}

/* Desce apenas o card animado; copy e lettering preservam sua posição. */
@media (min-width: 961px) {
    .dgf-cnn-pay__visual {
        top: 12px;
    }
}

@media (min-width: 641px) and (max-width: 960px) {
    .dgf-cnn-pay__background-title {
        top: max(3.5svh, calc(var(--dgf-cnn-site-header-offset, 0px) + 4px));
    }

    .dgf-cnn-pay__layout {
        padding-top: clamp(112px, 15svh, 145px);
    }

    .dgf-cnn-pay__visual {
        top: 10px;
    }
}

@media (max-width: 640px) {
    .dgf-cnn-pay__sticky {
        min-height: 100svh;
    }

    .dgf-cnn-pay__background-title {
        top: max(16px, calc(var(--dgf-cnn-site-header-offset, 0px) + 4px));
    }

    .dgf-cnn-pay__layout {
        padding-top: clamp(116px, 16svh, 138px);
    }
}

@media (max-width: 640px) and (max-height: 700px) {
    .dgf-cnn-pay__background-title {
        top: max(12px, calc(var(--dgf-cnn-site-header-offset, 0px) + 4px));
    }

    .dgf-cnn-pay__layout {
        padding-top: 106px;
    }
}