/* WEBOSCELL_LANDING_STAGE1_13_1_EFEITOS_VISUAIS_SUTIS_SEM_REFLOW
 * Escopo estrito: fundo, brilho, sombras, botões e microinterações.
 * Não altera grid, dimensões, margens, paddings, ordem ou alinhamento do layout.
 */

body.weboscell-lp-stage1-13-1-visual-fx {
    background-color: #061217;
    background-image:
        radial-gradient(circle at 12% 18%, rgba(0, 219, 167, .085), transparent 31%),
        radial-gradient(circle at 88% 10%, rgba(0, 174, 239, .065), transparent 27%),
        radial-gradient(circle at 52% 72%, rgba(16, 185, 129, .045), transparent 34%),
        linear-gradient(180deg, #061217 0%, #07141a 48%, #061116 100%);
    background-attachment: fixed;
}

body.weboscell-lp-stage1-13-1-visual-fx .page-glow {
    opacity: .82;
    background-image:
        linear-gradient(rgba(148, 163, 184, .026) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148, 163, 184, .026) 1px, transparent 1px),
        radial-gradient(circle at 20% 24%, rgba(52, 211, 153, .11), transparent 24%),
        radial-gradient(circle at 82% 18%, rgba(34, 211, 238, .08), transparent 22%);
    background-size: 38px 38px, 38px 38px, 100% 100%, 100% 100%;
    filter: saturate(1.08);
}

body.weboscell-lp-stage1-13-1-visual-fx .page-glow::before,
body.weboscell-lp-stage1-13-1-visual-fx .page-glow::after {
    content: "";
    position: absolute;
    inset: -18%;
    pointer-events: none;
    border-radius: 50%;
    opacity: .34;
    filter: blur(72px);
    transform: translate3d(0, 0, 0);
}

body.weboscell-lp-stage1-13-1-visual-fx .page-glow::before {
    background: radial-gradient(circle, rgba(16, 185, 129, .13), transparent 62%);
    animation: webosStage131AuraA 18s ease-in-out infinite alternate;
}

body.weboscell-lp-stage1-13-1-visual-fx .page-glow::after {
    background: radial-gradient(circle, rgba(14, 165, 233, .09), transparent 64%);
    animation: webosStage131AuraB 22s ease-in-out infinite alternate;
}

body.weboscell-lp-stage1-13-1-visual-fx .topbar {
    background: linear-gradient(180deg, rgba(5, 16, 21, .94), rgba(5, 16, 21, .82));
    border-bottom-color: rgba(52, 211, 153, .12);
    box-shadow: 0 10px 34px rgba(0, 0, 0, .16), 0 1px 0 rgba(255, 255, 255, .025) inset;
}

body.weboscell-lp-stage1-13-1-visual-fx :is(
    .top-cta,
    .hero-btn,
    .submit-btn,
    .mobile-sticky-cta a,
    .weboscell-proof-cta a,
    .webos-cta-teste-sem-custo-fix
) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    box-shadow:
        0 12px 30px rgba(16, 185, 129, .18),
        0 0 0 1px rgba(255, 255, 255, .13) inset,
        0 -1px 0 rgba(0, 0, 0, .12) inset;
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

body.weboscell-lp-stage1-13-1-visual-fx :is(
    .top-cta,
    .hero-btn,
    .submit-btn,
    .mobile-sticky-cta a,
    .weboscell-proof-cta a,
    .webos-cta-teste-sem-custo-fix
)::before {
    content: "";
    position: absolute;
    top: -70%;
    bottom: -70%;
    left: -42%;
    width: 28%;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .34), transparent);
    transform: skewX(-18deg);
    opacity: 0;
}

body.weboscell-lp-stage1-13-1-visual-fx :is(
    .top-cta,
    .hero-btn,
    .submit-btn,
    .mobile-sticky-cta a,
    .weboscell-proof-cta a,
    .webos-cta-teste-sem-custo-fix
):hover {
    transform: translateY(-2px);
    filter: brightness(1.045) saturate(1.06);
    box-shadow:
        0 16px 38px rgba(16, 185, 129, .25),
        0 0 0 1px rgba(255, 255, 255, .18) inset,
        0 0 28px rgba(52, 211, 153, .12);
}

body.weboscell-lp-stage1-13-1-visual-fx :is(
    .top-cta,
    .hero-btn,
    .submit-btn,
    .mobile-sticky-cta a,
    .weboscell-proof-cta a,
    .webos-cta-teste-sem-custo-fix
):hover::before {
    opacity: 1;
    animation: webosStage131ButtonShine .78s ease forwards;
}

body.weboscell-lp-stage1-13-1-visual-fx :is(.top-system-link, .hero-link) {
    border-color: rgba(125, 211, 252, .18);
    background-image: linear-gradient(180deg, rgba(15, 31, 39, .72), rgba(7, 20, 27, .72));
    box-shadow: 0 9px 24px rgba(0, 0, 0, .15), 0 0 0 1px rgba(255, 255, 255, .025) inset;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

body.weboscell-lp-stage1-13-1-visual-fx :is(.top-system-link, .hero-link):hover {
    transform: translateY(-1px);
    border-color: rgba(52, 211, 153, .38);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .19), 0 0 18px rgba(52, 211, 153, .075);
}

body.weboscell-lp-stage1-13-1-visual-fx :is(
    .top-cta,
    .hero-btn,
    .submit-btn,
    .mobile-sticky-cta a,
    .weboscell-proof-cta a,
    .webos-cta-teste-sem-custo-fix,
    .top-system-link,
    .hero-link
):focus-visible {
    outline: 3px solid rgba(110, 231, 183, .35);
    outline-offset: 3px;
}

body.weboscell-lp-stage1-13-1-visual-fx .price-highlight.weboscell-conversion-price {
    border-color: rgba(52, 211, 153, .30);
    background-image:
        radial-gradient(circle at 18% 20%, rgba(52, 211, 153, .10), transparent 35%),
        linear-gradient(135deg, rgba(17, 43, 43, .84), rgba(7, 22, 28, .90));
    box-shadow:
        0 18px 48px rgba(0, 0, 0, .22),
        0 0 0 1px rgba(52, 211, 153, .055) inset,
        0 0 34px rgba(16, 185, 129, .055);
    transition: border-color .25s ease, box-shadow .25s ease, filter .25s ease;
}

body.weboscell-lp-stage1-13-1-visual-fx .price-highlight.weboscell-conversion-price:hover {
    border-color: rgba(110, 231, 183, .45);
    box-shadow:
        0 22px 54px rgba(0, 0, 0, .25),
        0 0 0 1px rgba(110, 231, 183, .08) inset,
        0 0 42px rgba(16, 185, 129, .08);
    filter: brightness(1.018);
}

body.weboscell-lp-stage1-13-1-visual-fx .weboscell-lp-eyebrow {
    box-shadow: 0 10px 28px rgba(16, 185, 129, .09), 0 0 0 1px rgba(110, 231, 183, .06) inset;
}

@keyframes webosStage131AuraA {
    from { transform: translate3d(-6%, -3%, 0) scale(.92); }
    to { transform: translate3d(7%, 5%, 0) scale(1.08); }
}

@keyframes webosStage131AuraB {
    from { transform: translate3d(8%, -4%, 0) scale(1.06); }
    to { transform: translate3d(-7%, 6%, 0) scale(.94); }
}

@keyframes webosStage131ButtonShine {
    from { left: -42%; opacity: 0; }
    20% { opacity: .82; }
    to { left: 126%; opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    body.weboscell-lp-stage1-13-1-visual-fx .page-glow::before,
    body.weboscell-lp-stage1-13-1-visual-fx .page-glow::after,
    body.weboscell-lp-stage1-13-1-visual-fx :is(
        .top-cta,
        .hero-btn,
        .submit-btn,
        .mobile-sticky-cta a,
        .weboscell-proof-cta a,
        .webos-cta-teste-sem-custo-fix
    ):hover::before {
        animation: none !important;
    }

    body.weboscell-lp-stage1-13-1-visual-fx :is(
        .top-cta,
        .hero-btn,
        .submit-btn,
        .mobile-sticky-cta a,
        .weboscell-proof-cta a,
        .webos-cta-teste-sem-custo-fix,
        .top-system-link,
        .hero-link,
        .price-highlight.weboscell-conversion-price
    ) {
        transition: none !important;
    }
}

@media (max-width: 768px) {
    body.weboscell-lp-stage1-13-1-visual-fx {
        background-attachment: scroll;
    }

    body.weboscell-lp-stage1-13-1-visual-fx .page-glow::before,
    body.weboscell-lp-stage1-13-1-visual-fx .page-glow::after {
        filter: blur(58px);
        opacity: .24;
    }
}
