:root {
    --insta-1: #3b2a99;
    --insta-2: #4a37b6;
    --insta-3: #7d33ff;
    --insta-4: #ab58f4;
    --bg-main: #040607;
    --primary-gradient: linear-gradient(45deg, #ab58f4, #7d33ff, #4a37b6, #3b2a99);
    --gradient-primary: linear-gradient(135deg, #ab58f4, #7d33ff, #4a37b6);
    --gradient-button: linear-gradient(135deg, #ab58f4, #7d33ff, #4a37b6);
    --border-accent: rgba(125, 51, 255, 0.35);
}

body {
    background: var(--bg-main) !important;
    min-height: 100vh;
}

canvas {
    display: none !important;
}

main {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

main::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(900px 620px at 6% 8%, rgba(59, 42, 153, 0.18), transparent 72%), radial-gradient(820px 560px at 92% 88%, rgba(125, 51, 255, 0.16), transparent 74%), #040607;
}

.garantia-bg-blur {
    position: fixed;
    pointer-events: none;
    z-index: 0;
    border-radius: 9999px;
    filter: blur(145px);
    opacity: 0.86;
    will-change: transform, opacity;
    animation: garantiaBlurFloat 12s ease-in-out infinite;
}

.garantia-bg-blur-a {
    top: -22%;
    left: -22%;
    width: min(74vw, 760px);
    height: min(74vw, 760px);
    background: rgba(59, 42, 153, 0.72);
    animation-delay: 0s;
}

.garantia-bg-blur-b {
    right: -16%;
    top: 34%;
    width: min(54vw, 560px);
    height: min(54vw, 560px);
    background: rgba(171, 88, 244, 0.56);
    animation-delay: 2s;
}

.garantia-bg-blur-c {
    right: -12%;
    bottom: -26%;
    width: min(72vw, 700px);
    height: min(72vw, 700px);
    background: rgba(125, 51, 255, 0.62);
    animation-delay: 4s;
}

@keyframes garantiaBlurFloat {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 0.84;
    }
    35% {
        transform: translate3d(1.5%, -2%, 0) scale(1.07);
        opacity: 0.95;
    }
    65% {
        transform: translate3d(-2%, 1.5%, 0) scale(0.96);
        opacity: 0.78;
    }
    100% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 0.84;
    }
}

.container-dpgm {
    position: relative;
    z-index: 2;
}

.title-dpgm,
.faq-new-title {
    color: #fff !important;
}

.subtitle-dpgm,
.faq-new-btn span:first-child,
.faq-new-answer p {
    color: #c7d0de !important;
}

.text-gradient,
.pricing-current,
.offer-gradient-text {
    -webkit-text-fill-color: transparent !important;
    background: var(--primary-gradient) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
}

[style*="linear-gradient(135deg, #4a37b6 0%, #ab58f4 100%)"] {
    background: var(--primary-gradient) !important;
}

.card-dpgm,
.faq-new {
    border-radius: 30px !important;
    background: rgba(12, 16, 17, 0.88) !important;
    backdrop-filter: blur(22px);
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 28px 60px -24px rgba(0, 0, 0, 0.68);
}

.card-highlight {
    position: relative;
    box-shadow: 0 30px 64px -26px rgba(125, 51, 255, 0.42), 0 8px 26px -14px rgba(59, 42, 153, 0.35), 0 0 18px rgba(171, 88, 244, 0.2) !important;
    overflow: hidden;
}

.card-highlight::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--primary-gradient);
}

.pricing-old {
    color: #8b95a7 !important;
}

.pricing-note {
    color: #cbd5e1 !important;
}

.badge-primary {
    background: var(--primary-gradient) !important;
    color: #fff !important;
}

.btn-dpgm,
a[class*="btn"] {
    border-radius: 22px !important;
    background: var(--primary-gradient) !important;
    box-shadow: 0 18px 40px -10px rgba(125, 51, 255, 0.48);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.btn-dpgm:hover,
a[class*="btn"]:hover {
    transform: translateY(-1px) scale(1.01);
    box-shadow: 0 22px 48px -10px rgba(125, 51, 255, 0.6);
}

.faq-new-icon {
    color: #ab58f4 !important;
}