*{
    box-sizing:border-box;
    margin:0;
    padding:0;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:Arial,Helvetica,sans-serif;
    color:#0f172a;
    background:#f5f7fb;
    overflow-x:hidden;
}

.cv-container{
    width:min(1160px,92%);
    margin:auto;
}


/* HEADER */

.cv-header{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(7,18,38,.94);
    border-bottom:1px solid rgba(255,255,255,.08);
    backdrop-filter:blur(14px);
}

.cv-nav{
    height:72px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.cv-logo{
    display:inline-flex;
    align-items:flex-end;
    color:#fff;
    text-decoration:none;
    font-weight:950;
    font-size:28px;
    letter-spacing:-1.5px;
}

.cv-logo b{
    color:#facc15;
    margin-left:4px;
    font-size:15px;
    margin-bottom:3px;
}

.cv-back{
    color:#dbeafe;
    text-decoration:none;
    font-size:13px;
    font-weight:800;
    padding:10px 14px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:12px;
}


/* HERO */

.cv-hero{
    position:relative;
    overflow:hidden;
    padding:90px 0 100px;
    color:#fff;
    background:
        radial-gradient(circle at 80% 20%,rgba(37,99,235,.38),transparent 30%),
        radial-gradient(circle at 10% 0%,rgba(124,58,237,.30),transparent 27%),
        linear-gradient(135deg,#070d1f,#0b1f46 55%,#0c438e);
}

.cv-hero:before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.18;
    background-image:
        linear-gradient(rgba(255,255,255,.15) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.15) 1px,transparent 1px);
    background-size:44px 44px;
}

.cv-hero-grid{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:1fr .8fr;
    gap:90px;
    align-items:center;
}

.cv-small-label{
    display:inline-block;
    color:#facc15;
    font-size:12px;
    font-weight:950;
    letter-spacing:2px;
    margin-bottom:18px;
}

.cv-hero h1{
    font-size:66px;
    line-height:.98;
    letter-spacing:-4px;
    max-width:650px;
}

.cv-hero h1 strong{
    display:block;
    color:#facc15;
}

.cv-hero-copy>p{
    max-width:620px;
    color:#cbd5e1;
    line-height:1.75;
    font-size:17px;
    margin-top:25px;
}

.cv-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:30px;
}

.cv-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-weight:900;
    border-radius:13px;
    padding:15px 20px;
    transition:.2s;
    font-size:13px;
}

.cv-btn:hover{
    transform:translateY(-2px);
}

.cv-btn-main{
    background:#facc15;
    color:#261f00;
    box-shadow:0 12px 30px rgba(250,204,21,.22);
}

.cv-btn-outline{
    color:#fff;
    border:1px solid rgba(255,255,255,.18);
    background:rgba(255,255,255,.07);
}


/* PHONE */

.cv-phone-area{
    position:relative;
    min-height:470px;
    display:flex;
    justify-content:center;
    align-items:center;
}

.cv-phone{
    width:285px;
    border:8px solid #111827;
    border-radius:38px;
    background:#111827;
    box-shadow:0 35px 80px rgba(0,0,0,.45);
    transform:rotate(4deg);
}

.cv-phone-top{
    height:29px;
    display:flex;
    justify-content:center;
    align-items:center;
}

.cv-phone-top span{
    display:block;
    width:70px;
    height:7px;
    background:#374151;
    border-radius:999px;
}

.cv-phone-screen{
    min-height:410px;
    padding:20px 15px;
    border-radius:26px;
    background:linear-gradient(180deg,#f8fafc,#eaf1ff);
    color:#0f172a;
}

.cv-mini-logo{
    font-size:20px;
    font-weight:950;
    color:#1d4ed8;
}

.cv-mini-logo b{
    color:#f59e0b;
    font-size:11px;
}

.cv-mini-title{
    font-size:13px;
    font-weight:900;
    margin:28px 0 14px;
}

.cv-mini-card{
    display:grid;
    grid-template-columns:45px 1fr auto;
    gap:9px;
    align-items:center;
    background:#fff;
    padding:10px;
    border-radius:13px;
    margin-bottom:9px;
    border:1px solid #e2e8f0;
}

.cv-avatar{
    width:45px;
    height:45px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:950;
    color:#fff;
    background:linear-gradient(135deg,#2563eb,#7c3aed);
}

.cv-mini-info{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.cv-mini-info b{
    font-size:9px;
}

.cv-mini-info small{
    font-size:7px;
    color:#64748b;
}

.cv-mini-card button{
    border:0;
    background:#2563eb;
    color:#fff;
    font-size:7px;
    padding:7px 8px;
    border-radius:7px;
    font-weight:900;
}

.cv-floating{
    position:absolute;
    background:#fff;
    color:#0f172a;
    padding:12px 15px;
    border-radius:14px;
    font-size:11px;
    font-weight:900;
    box-shadow:0 15px 40px rgba(0,0,0,.23);
}

.cv-floating-1{
    left:20px;
    top:90px;
}

.cv-floating-2{
    right:5px;
    bottom:75px;
    color:#166534;
}


/* INTRO */

.cv-intro{
    position:relative;
    margin-top:-36px;
    z-index:5;
}

.cv-intro-grid{
    background:#fff;
    border-radius:22px;
    padding:18px;
    box-shadow:0 20px 55px rgba(15,23,42,.12);
    display:grid;
    grid-template-columns:repeat(5,1fr);
}

.cv-intro-grid div{
    display:flex;
    flex-direction:column;
    text-align:center;
    gap:5px;
    border-right:1px solid #e5e7eb;
}

.cv-intro-grid div:last-child{
    border-right:0;
}

.cv-intro-grid strong{
    color:#2563eb;
    font-size:13px;
}

.cv-intro-grid span{
    font-size:12px;
    font-weight:900;
}


/* TITLES */

.cv-section-title{
    max-width:700px;
    margin:0 auto 60px;
    text-align:center;
}

.cv-section-title>span,
.cv-faq-title>span{
    display:block;
    color:#2563eb;
    font-weight:950;
    letter-spacing:2px;
    font-size:11px;
    margin-bottom:12px;
}

.cv-section-title h2,
.cv-faq-title h2,
.cv-payment-copy h2{
    font-size:44px;
    letter-spacing:-2px;
    line-height:1.05;
}

.cv-section-title p{
    margin-top:14px;
    color:#64748b;
    line-height:1.7;
}


/* STEPS */

.cv-steps{
    padding:110px 0;
}

.cv-timeline{
    display:grid;
    gap:28px;
    max-width:1000px;
    margin:auto;
}

.cv-step{
    display:grid;
    grid-template-columns:70px 1fr;
    gap:24px;
    position:relative;
}

.cv-step:not(:last-child):before{
    content:"";
    position:absolute;
    width:2px;
    background:#dbe3ef;
    top:65px;
    bottom:-30px;
    left:34px;
}

.cv-step-number{
    position:relative;
    z-index:3;
    width:70px;
    height:70px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:23px;
    font-weight:950;
    background:linear-gradient(135deg,#2563eb,#7c3aed);
    box-shadow:0 12px 30px rgba(37,99,235,.2);
}

.cv-step-content{
    display:grid;
    grid-template-columns:1fr .9fr;
    gap:34px;
    padding:30px;
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:24px;
    box-shadow:0 12px 35px rgba(15,23,42,.05);
    align-items:center;
}

.cv-step-tag{
    color:#2563eb;
    font-size:9px;
    font-weight:950;
    letter-spacing:1.5px;
}

.cv-step-text h3{
    font-size:25px;
    margin:7px 0 10px;
    letter-spacing:-.7px;
}

.cv-step-text p{
    color:#64748b;
    line-height:1.7;
    font-size:13px;
}

.cv-demo-browser{
    border:1px solid #dbe3ef;
    border-radius:15px;
    overflow:hidden;
    background:#f8fafc;
}

.cv-demo-bar{
    padding:8px;
    background:#e8edf5;
    display:flex;
    gap:5px;
}

.cv-demo-bar i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#94a3b8;
}

.cv-demo-body{
    padding:28px 18px;
    text-align:center;
}

.cv-demo-title{
    font-size:12px;
    color:#1d4ed8;
    font-weight:950;
}

.cv-demo-category{
    background:#fff;
    border:1px solid #e2e8f0;
    margin-top:15px;
    border-radius:10px;
    padding:12px;
    font-size:9px;
    color:#64748b;
}

.cv-candidate-demo{
    display:grid;
    grid-template-columns:55px 1fr auto;
    gap:10px;
    align-items:center;
    padding:13px;
    border-radius:15px;
    background:#f8fafc;
    border:1px solid #dbe3ef;
}

.cv-candidate-avatar{
    width:55px;
    height:55px;
    border-radius:15px;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:950;
    background:linear-gradient(135deg,#2563eb,#7c3aed);
}

.cv-candidate-demo div:nth-child(2){
    display:flex;
    flex-direction:column;
    gap:4px;
}

.cv-candidate-demo strong{
    font-size:11px;
}

.cv-candidate-demo span{
    font-size:8px;
    color:#64748b;
}

.cv-candidate-demo button{
    border:0;
    color:#fff;
    background:#2563eb;
    border-radius:8px;
    font-size:7px;
    font-weight:900;
    padding:8px;
}

.cv-quantity-demo{
    background:#f8fafc;
    border:1px solid #e2e8f0;
    padding:20px;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:15px;
    border-radius:15px;
}

.cv-quantity-demo button{
    width:42px;
    height:42px;
    border:0;
    border-radius:12px;
    background:#2563eb;
    color:#fff;
    font-size:20px;
    font-weight:900;
}

.cv-quantity-demo strong{
    min-width:65px;
    text-align:center;
    font-size:25px;
}

.cv-cart-demo{
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:15px;
    overflow:hidden;
}

.cv-cart-demo div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:11px 13px;
    border-bottom:1px solid #e5e7eb;
}

.cv-cart-demo div:last-child{
    border-bottom:0;
}

.cv-cart-demo span{
    font-size:9px;
    color:#64748b;
}

.cv-cart-demo strong{
    font-size:10px;
}

.cv-payment-demo{
    display:grid;
    gap:9px;
}

.cv-payment-option{
    display:flex;
    align-items:center;
    gap:12px;
    background:#f8fafc;
    border:1px solid #dbe3ef;
    padding:13px;
    border-radius:14px;
}

.cv-payment-icon{
    width:42px;
    height:42px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#e8efff;
    color:#2563eb;
    font-size:20px;
    font-weight:950;
}

.cv-payment-option div:last-child{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.cv-payment-option strong{
    font-size:11px;
}

.cv-payment-option span{
    font-size:8px;
    color:#64748b;
}

.cv-step-final .cv-step-number{
    background:linear-gradient(135deg,#16a34a,#22c55e);
}

.cv-success{
    color:#16a34a;
}

.cv-approved{
    text-align:center;
    padding:22px;
    border-radius:16px;
    background:#f0fdf4;
    border:1px solid #bbf7d0;
}

.cv-check{
    width:52px;
    height:52px;
    margin:0 auto 10px;
    background:#22c55e;
    color:#fff;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    font-weight:950;
}

.cv-approved strong{
    display:block;
    font-size:12px;
    color:#166534;
}

.cv-approved span{
    display:block;
    margin-top:4px;
    font-size:9px;
    color:#4b7c59;
}


/* PAYMENT SECTION */

.cv-payment-section{
    padding:95px 0;
    color:#fff;
    background:
        radial-gradient(circle at 10% 20%,rgba(124,58,237,.26),transparent 28%),
        linear-gradient(135deg,#071426,#101b51 58%,#174faf);
}

.cv-payment-grid{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:65px;
    align-items:center;
}

.cv-payment-copy p{
    margin-top:15px;
    max-width:470px;
    color:#cbd5e1;
    line-height:1.7;
}

.cv-payment-cards{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.cv-payment-cards>div{
    padding:28px;
    border-radius:22px;
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.12);
}

.cv-big-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:55px;
    height:55px;
    border-radius:16px;
    color:#facc15;
    background:rgba(250,204,21,.11);
    font-size:25px;
}

.cv-payment-cards h3{
    margin-top:17px;
    font-size:20px;
}

.cv-payment-cards p{
    color:#b9c7dc;
    font-size:12px;
    line-height:1.65;
    margin-top:8px;
}


/* ALERTS */

.cv-alerts{
    padding:100px 0;
}

.cv-alert-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
}

.cv-alert-grid article{
    padding:28px;
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:21px;
}

.cv-alert-icon{
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    background:#eef4ff;
    font-size:19px;
}

.cv-alert-grid h3{
    font-size:17px;
    margin:16px 0 9px;
}

.cv-alert-grid p{
    font-size:12px;
    color:#64748b;
    line-height:1.65;
}


/* FAQ */

.cv-faq{
    padding:100px 0;
    background:#fff;
}

.cv-faq-grid{
    display:grid;
    grid-template-columns:.65fr 1.35fr;
    gap:70px;
}

.cv-faq-title{
    position:sticky;
    top:100px;
    align-self:start;
}

.cv-faq-list{
    display:grid;
    gap:10px;
}

.cv-faq-list details{
    border:1px solid #e2e8f0;
    border-radius:16px;
    background:#f8fafc;
    padding:0 18px;
}

.cv-faq-list summary{
    cursor:pointer;
    list-style:none;
    font-weight:900;
    font-size:13px;
    padding:18px 35px 18px 0;
    position:relative;
}

.cv-faq-list summary::-webkit-details-marker{
    display:none;
}

.cv-faq-list summary:after{
    content:"+";
    position:absolute;
    right:0;
    top:12px;
    width:30px;
    height:30px;
    border-radius:9px;
    color:#2563eb;
    background:#e8efff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
}

.cv-faq-list details[open] summary:after{
    content:"−";
}

.cv-faq-list details p{
    color:#64748b;
    font-size:12px;
    line-height:1.65;
    padding-bottom:18px;
}


/* FINAL CTA */

.cv-final{
    padding:90px 0;
    background:#f5f7fb;
}

.cv-final-box{
    padding:60px 30px;
    border-radius:30px;
    text-align:center;
    color:#fff;
    background:
        radial-gradient(circle at 10% 20%,rgba(250,204,21,.16),transparent 27%),
        linear-gradient(135deg,#3b1644,#202078 55%,#1261bf);
}

.cv-final-box>span{
    color:#facc15;
    font-size:10px;
    font-weight:950;
    letter-spacing:2px;
}

.cv-final-box h2{
    max-width:620px;
    margin:12px auto;
    font-size:45px;
    letter-spacing:-2px;
}

.cv-final-box p{
    color:#dbeafe;
    margin-bottom:24px;
}

.cv-btn-yellow{
    background:#facc15;
    color:#231e00;
}


/* FOOTER */

.cv-footer{
    background:#071426;
    color:#cbd5e1;
    padding:42px 0 18px;
}

.cv-footer-grid{
    display:grid;
    grid-template-columns:1.4fr .7fr .7fr;
    gap:35px;
}

.cv-footer-grid>div{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.cv-footer-logo{
    margin-bottom:5px;
}

.cv-footer p{
    max-width:330px;
    font-size:11px;
    line-height:1.6;
}

.cv-footer strong{
    color:#fff;
    font-size:12px;
    margin-bottom:4px;
}

.cv-footer a:not(.cv-logo){
    text-decoration:none;
    color:#cbd5e1;
    font-size:11px;
}

.cv-copyright{
    width:min(1160px,92%);
    margin:26px auto 0;
    border-top:1px solid rgba(255,255,255,.09);
    padding-top:16px;
    text-align:center;
    font-size:9px;
    color:#8290a4;
}


/* TABLET */

@media(max-width:900px){

    .cv-hero-grid{
        grid-template-columns:1fr;
        gap:45px;
    }

    .cv-hero-copy{
        text-align:center;
    }

    .cv-hero h1{
        margin:auto;
    }

    .cv-hero-copy>p{
        margin-left:auto;
        margin-right:auto;
    }

    .cv-hero-actions{
        justify-content:center;
    }

    .cv-phone-area{
        min-height:430px;
    }

    .cv-step-content{
        grid-template-columns:1fr;
    }

    .cv-payment-grid{
        grid-template-columns:1fr;
    }

    .cv-faq-grid{
        grid-template-columns:1fr;
        gap:35px;
    }

    .cv-faq-title{
        position:static;
        text-align:center;
    }

}


/* MOBILE */

@media(max-width:700px){

    .cv-nav{
        height:64px;
    }

    .cv-logo{
        font-size:24px;
    }

    .cv-back{
        font-size:10px;
        padding:9px 10px;
    }

    .cv-hero{
        padding:65px 0 85px;
    }

    .cv-hero h1{
        font-size:43px;
        letter-spacing:-2.5px;
    }

    .cv-hero-copy>p{
        font-size:14px;
    }

    .cv-hero-actions{
        display:grid;
    }

    .cv-btn{
        width:100%;
    }

    .cv-phone-area{
        min-height:390px;
    }

    .cv-phone{
        width:250px;
    }

    .cv-floating-1{
        left:0;
    }

    .cv-floating-2{
        right:0;
    }

    .cv-intro-grid{
        padding:12px 6px;
        grid-template-columns:repeat(5,1fr);
    }

    .cv-intro-grid div{
        padding:5px 3px;
    }

    .cv-intro-grid strong{
        font-size:10px;
    }

    .cv-intro-grid span{
        font-size:8px;
    }

    .cv-steps{
        padding:75px 0;
    }

    .cv-section-title{
        margin-bottom:40px;
    }

    .cv-section-title h2,
    .cv-faq-title h2,
    .cv-payment-copy h2{
        font-size:34px;
    }

    .cv-step{
        grid-template-columns:50px 1fr;
        gap:12px;
    }

    .cv-step-number{
        width:50px;
        height:50px;
        border-radius:15px;
        font-size:17px;
    }

    .cv-step:not(:last-child):before{
        left:24px;
        top:46px;
    }

    .cv-step-content{
        padding:19px;
        gap:20px;
    }

    .cv-step-text h3{
        font-size:20px;
    }

    .cv-candidate-demo{
        grid-template-columns:45px 1fr;
    }

    .cv-candidate-avatar{
        width:45px;
        height:45px;
    }

    .cv-candidate-demo button{
        grid-column:1/-1;
    }

    .cv-payment-cards{
        grid-template-columns:1fr 1fr;
        gap:9px;
    }

    .cv-payment-cards>div{
        padding:18px;
    }

    .cv-alert-grid{
        grid-template-columns:1fr;
    }

    .cv-final-box{
        padding:45px 20px;
    }

    .cv-final-box h2{
        font-size:34px;
    }

    .cv-footer{
        padding:30px 0 15px;
    }

    .cv-footer-grid{
        grid-template-columns:1fr 1fr;
        gap:20px;
    }

    .cv-footer-grid>div:first-child{
        grid-column:1/-1;
    }

}


/* TELAS PEQUENAS */

@media(max-width:430px){

    .cv-hero h1{
        font-size:38px;
    }

    .cv-floating{
        font-size:9px;
        padding:9px 10px;
    }

    .cv-payment-cards{
        grid-template-columns:1fr;
    }

    .cv-step-content{
        padding:16px;
    }

    .cv-footer-grid{
        grid-template-columns:1fr 1fr;
    }

}


/* ==========================================================
   COMO VOTAR - HERO SEM MOCKUP DE CELULAR
   ========================================================== */

.cv-hero-grid{
    grid-template-columns:1fr !important;
    gap:0 !important;
    max-width:900px !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

.cv-hero-copy{
    width:100% !important;
    max-width:850px !important;
    margin:0 auto !important;
    text-align:center !important;
}

.cv-hero h1{
    margin-left:auto !important;
    margin-right:auto !important;
}

.cv-hero-copy > p{
    margin-left:auto !important;
    margin-right:auto !important;
}

.cv-hero-actions{
    justify-content:center !important;
}

.cv-phone-area{
    display:none !important;
}

@media(max-width:700px){

    .cv-hero{
        padding-top:58px !important;
        padding-bottom:80px !important;
    }

    .cv-hero-copy{
        text-align:center !important;
    }

    .cv-hero-actions{
        justify-content:center !important;
    }
}


/* ==========================================================
   SEPARACAO ENTRE PASSO FINAL E BLOCO IMPORTANTE
   ========================================================== */

.cv-steps{
    position:relative;
}

.cv-steps::after{
    content:"";
    display:block;
    width:min(920px,88%);
    height:1px;
    margin:70px auto 0;
    background:linear-gradient(
        90deg,
        transparent,
        rgba(37,99,235,.18),
        rgba(124,58,237,.28),
        rgba(37,99,235,.18),
        transparent
    );
}

.cv-alerts{
    position:relative;
    padding-top:120px !important;
    background:
        linear-gradient(
            180deg,
            rgba(37,99,235,.035) 0%,
            rgba(245,247,251,0) 190px
        ),
        #f5f7fb;
}

.cv-alerts::before{
    content:"";
    position:absolute;
    top:45px;
    left:50%;
    transform:translateX(-50%);
    width:44px;
    height:5px;
    border-radius:999px;
    background:linear-gradient(
        90deg,
        #2563eb,
        #7c3aed
    );
    opacity:.7;
}

@media(max-width:700px){

    .cv-steps::after{
        margin-top:55px;
        width:84%;
    }

    .cv-alerts{
        padding-top:105px !important;
    }

    .cv-alerts::before{
        top:38px;
        width:38px;
        height:4px;
    }

}

/* ==========================================================
   FIM SEPARACAO
   ========================================================== */


/* ==========================================================
   AJUSTE VISUAL FAQ + CTA FINAL
   ========================================================== */

/* ------------------------------
   Separação antes da FAQ
------------------------------ */
.cv-faq{
    position:relative;
    padding-top:120px !important;
    background:
        linear-gradient(
            180deg,
            rgba(37,99,235,.04) 0%,
            rgba(245,247,251,0) 160px
        ),
        #ffffff !important;
}

.cv-faq::before{
    content:"";
    position:absolute;
    top:48px;
    left:50%;
    transform:translateX(-50%);
    width:min(920px,88%);
    height:1px;
    background:linear-gradient(
        90deg,
        transparent,
        rgba(37,99,235,.18),
        rgba(124,58,237,.28),
        rgba(37,99,235,.18),
        transparent
    );
}

.cv-faq::after{
    content:"";
    position:absolute;
    top:68px;
    left:50%;
    transform:translateX(-50%);
    width:42px;
    height:5px;
    border-radius:999px;
    background:linear-gradient(90deg,#2563eb,#7c3aed);
    opacity:.75;
}


/* ------------------------------
   Separação antes do CTA final
------------------------------ */
.cv-final{
    position:relative;
    padding-top:120px !important;
    padding-bottom:100px !important;
    background:
        linear-gradient(
            180deg,
            rgba(124,58,237,.035) 0%,
            rgba(245,247,251,0) 160px
        ),
        #f5f7fb !important;
}

.cv-final::before{
    content:"";
    position:absolute;
    top:45px;
    left:50%;
    transform:translateX(-50%);
    width:min(920px,88%);
    height:1px;
    background:linear-gradient(
        90deg,
        transparent,
        rgba(37,99,235,.18),
        rgba(124,58,237,.28),
        rgba(37,99,235,.18),
        transparent
    );
}

.cv-final::after{
    content:"";
    position:absolute;
    top:65px;
    left:50%;
    transform:translateX(-50%);
    width:42px;
    height:5px;
    border-radius:999px;
    background:linear-gradient(90deg,#2563eb,#7c3aed);
    opacity:.75;
}


/* ------------------------------
   Card final mais premium
------------------------------ */
.cv-final-box{
    position:relative;
    overflow:hidden;
    max-width:900px;
    margin:0 auto;
    padding:56px 34px !important;
    border-radius:28px !important;
    border:1px solid rgba(255,255,255,.14);
    box-shadow:0 28px 70px rgba(15,23,42,.18);
    background:
        radial-gradient(circle at 12% 20%,rgba(250,204,21,.14),transparent 22%),
        radial-gradient(circle at 85% 15%,rgba(255,255,255,.08),transparent 22%),
        linear-gradient(135deg,#2e1240 0%,#23278f 52%,#1f6bda 100%) !important;
}

.cv-final-box::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.10;
    background-image:
        linear-gradient(rgba(255,255,255,.20) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.20) 1px, transparent 1px);
    background-size:42px 42px;
    pointer-events:none;
}

.cv-final-box > *{
    position:relative;
    z-index:2;
}

.cv-final-box > span{
    display:inline-block;
    margin-bottom:10px;
    padding:8px 14px;
    border-radius:999px;
    background:rgba(250,204,21,.12);
    border:1px solid rgba(250,204,21,.22);
    color:#facc15 !important;
    font-size:11px !important;
    font-weight:950;
    letter-spacing:2px;
}

.cv-final-box h2{
    max-width:620px;
    margin:0 auto 14px !important;
    font-size:50px !important;
    line-height:1.05;
    letter-spacing:-2.2px;
}

.cv-final-box p{
    max-width:560px;
    margin:0 auto 26px !important;
    color:#e5eefc !important;
    font-size:17px;
    line-height:1.65;
}

/* ------------------------------
   Botão final mais bonito
------------------------------ */
.cv-btn-yellow{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:280px;
    min-height:58px;
    padding:16px 28px !important;
    border-radius:16px !important;
    border:1px solid rgba(255,255,255,.18);
    background:linear-gradient(135deg,#facc15,#f59e0b) !important;
    color:#1f1a00 !important;
    font-size:16px !important;
    font-weight:950 !important;
    box-shadow:
        0 18px 40px rgba(245,158,11,.28),
        inset 0 1px 0 rgba(255,255,255,.35);
    transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.cv-btn-yellow:hover{
    transform:translateY(-2px);
    box-shadow:
        0 24px 48px rgba(245,158,11,.34),
        inset 0 1px 0 rgba(255,255,255,.38);
    filter:brightness(1.02);
}


/* ------------------------------
   Mobile
------------------------------ */
@media(max-width:700px){

    .cv-faq{
        padding-top:100px !important;
    }

    .cv-faq::before{
        top:38px;
        width:84%;
    }

    .cv-faq::after{
        top:56px;
        width:36px;
        height:4px;
    }

    .cv-final{
        padding-top:100px !important;
        padding-bottom:84px !important;
    }

    .cv-final::before{
        top:36px;
        width:84%;
    }

    .cv-final::after{
        top:54px;
        width:36px;
        height:4px;
    }

    .cv-final-box{
        padding:42px 20px !important;
        border-radius:24px !important;
    }

    .cv-final-box > span{
        font-size:10px !important;
        padding:7px 12px;
    }

    .cv-final-box h2{
        font-size:34px !important;
        line-height:1.12;
        letter-spacing:-1.5px;
    }

    .cv-final-box p{
        font-size:15px;
        margin-bottom:20px !important;
    }

    .cv-btn-yellow{
        width:100% !important;
        min-width:0 !important;
        min-height:54px;
        font-size:15px !important;
        border-radius:15px !important;
    }
}

/* ==========================================================
   FIM AJUSTE VISUAL FAQ + CTA FINAL
   ========================================================== */


/* ===== TEMA VOTEMAIS ESCURO FINAL ===== */

/* ==========================================================
   BASE
   ========================================================== */

html,
body{
    background:#07152f !important;
}

body{
    color:#ffffff !important;
}


/* ==========================================================
   REMOVE OS PADDINGS PEDIDOS
   ========================================================== */

.cv-steps{
    padding:0 !important;
}

.cv-alerts{
    padding:0 !important;
}

@media(max-width:700px){

    .cv-steps{
        padding:0 !important;
    }

    .cv-alerts{
        padding:0 !important;
    }

}


/* ==========================================================
   BLOCO DE ETAPAS
   ========================================================== */

.cv-steps{
    background:
        radial-gradient(circle at 10% 10%,
            rgba(37,99,235,.13),
            transparent 25%),
        radial-gradient(circle at 90% 45%,
            rgba(124,58,237,.10),
            transparent 28%),
        #07152f !important;
}

.cv-steps .cv-container{
    padding-top:48px;
    padding-bottom:48px;
}

.cv-section-title > span,
.cv-faq-title > span{
    color:#facc15 !important;
}

.cv-section-title h2,
.cv-faq-title h2{
    color:#ffffff !important;
}

.cv-section-title p{
    color:#a9bddc !important;
}


/* ==========================================================
   TIMELINE
   ========================================================== */

.cv-step:not(:last-child)::before{
    background:linear-gradient(
        180deg,
        #2563eb,
        rgba(124,58,237,.55)
    ) !important;
}

.cv-step-number{
    color:#ffffff !important;
    border:1px solid rgba(96,165,250,.45);
    background:linear-gradient(
        135deg,
        #2563eb,
        #6d28d9
    ) !important;
    box-shadow:
        0 12px 30px rgba(37,99,235,.22) !important;
}

.cv-step-final .cv-step-number{
    background:linear-gradient(
        135deg,
        #10b981,
        #22c55e
    ) !important;
}


/* ==========================================================
   CARDS DOS PASSOS
   ========================================================== */

.cv-step-content{
    background:
        linear-gradient(
            145deg,
            rgba(15,45,94,.96),
            rgba(8,34,75,.98)
        ) !important;

    border:1px solid rgba(74,144,226,.48) !important;

    box-shadow:
        0 14px 35px rgba(0,0,0,.18) !important;
}

.cv-step-tag{
    color:#facc15 !important;
}

.cv-step-text h3{
    color:#ffffff !important;
}

.cv-step-text p{
    color:#b9c9df !important;
}


/* ==========================================================
   DEMONSTRAÇÕES INTERNAS
   ========================================================== */

.cv-demo-browser,
.cv-candidate-demo,
.cv-quantity-demo,
.cv-cart-demo,
.cv-payment-option{
    background:#091e43 !important;
    border-color:rgba(71,134,210,.45) !important;
    color:#ffffff !important;
}

.cv-demo-bar{
    background:#0d2b59 !important;
}

.cv-demo-bar i{
    background:#5d7da9 !important;
}

.cv-demo-body{
    background:#091e43 !important;
}

.cv-demo-title{
    color:#facc15 !important;
}

.cv-demo-category{
    background:#0d2b59 !important;
    border-color:rgba(71,134,210,.38) !important;
    color:#cbdaf0 !important;
}

.cv-candidate-demo strong,
.cv-cart-demo strong,
.cv-payment-option strong{
    color:#ffffff !important;
}

.cv-candidate-demo span,
.cv-cart-demo span,
.cv-payment-option span{
    color:#9fb6d5 !important;
}

.cv-candidate-demo button,
.cv-quantity-demo button{
    background:linear-gradient(
        135deg,
        #7c3aed,
        #2563eb
    ) !important;
}

.cv-quantity-demo strong{
    color:#facc15 !important;
}


/* ==========================================================
   PAGAMENTO CONFIRMADO
   ========================================================== */

.cv-approved{
    background:
        linear-gradient(
            135deg,
            rgba(6,78,59,.70),
            rgba(5,55,52,.92)
        ) !important;

    border:1px solid rgba(34,197,94,.5) !important;
}

.cv-approved strong{
    color:#86efac !important;
}

.cv-approved span{
    color:#bbf7d0 !important;
}


/* ==========================================================
   IMPORTANTE
   ========================================================== */

.cv-alerts{
    position:relative;
    background:
        radial-gradient(circle at 85% 10%,
            rgba(124,58,237,.10),
            transparent 25%),
        #081936 !important;
}

/* mantém espaço usando container, sem padding da section */
.cv-alerts .cv-container{
    padding-top:70px;
    padding-bottom:70px;
}

.cv-alerts::before{
    top:24px !important;
    background:linear-gradient(
        90deg,
        #facc15,
        #22d3ee,
        #7c3aed
    ) !important;
}

.cv-alert-grid article{
    background:
        linear-gradient(
            145deg,
            #0d2c5d,
            #092044
        ) !important;

    border:1px solid rgba(58,134,219,.48) !important;

    box-shadow:
        0 12px 32px rgba(0,0,0,.14) !important;
}

.cv-alert-grid h3{
    color:#ffffff !important;
}

.cv-alert-grid p{
    color:#b6c9e3 !important;
}

.cv-alert-icon{
    background:linear-gradient(
        135deg,
        rgba(37,99,235,.30),
        rgba(124,58,237,.28)
    ) !important;

    border:1px solid rgba(96,165,250,.28);
}


/* ==========================================================
   FAQ / DÚVIDAS
   ========================================================== */

.cv-faq{
    background:
        radial-gradient(circle at 10% 20%,
            rgba(37,99,235,.11),
            transparent 26%),
        #07152f !important;

    color:#ffffff !important;
}

.cv-faq::before{
    background:linear-gradient(
        90deg,
        transparent,
        rgba(250,204,21,.25),
        rgba(34,211,238,.42),
        rgba(124,58,237,.42),
        transparent
    ) !important;
}

.cv-faq::after{
    background:linear-gradient(
        90deg,
        #facc15,
        #22d3ee,
        #7c3aed
    ) !important;
}

.cv-faq-list details{
    background:
        linear-gradient(
            145deg,
            #0d2c5d,
            #092044
        ) !important;

    border:1px solid rgba(59,130,246,.42) !important;

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

.cv-faq-list summary{
    color:#ffffff !important;
}

.cv-faq-list summary::after{
    background:rgba(37,99,235,.25) !important;
    color:#facc15 !important;
}

.cv-faq-list details p{
    color:#b8c9e1 !important;
}


/* ==========================================================
   CARD FINAL
   ========================================================== */

.cv-final{
    background:
        radial-gradient(circle at 85% 25%,
            rgba(37,99,235,.12),
            transparent 26%),
        #081936 !important;
}

.cv-final::before{
    background:linear-gradient(
        90deg,
        transparent,
        rgba(250,204,21,.25),
        rgba(34,211,238,.40),
        rgba(124,58,237,.40),
        transparent
    ) !important;
}

.cv-final::after{
    background:linear-gradient(
        90deg,
        #facc15,
        #22d3ee,
        #7c3aed
    ) !important;
}

.cv-final-box{
    border:1px solid rgba(96,165,250,.38) !important;

    background:
        radial-gradient(
            circle at 10% 10%,
            rgba(250,204,21,.13),
            transparent 25%
        ),
        radial-gradient(
            circle at 90% 20%,
            rgba(37,99,235,.22),
            transparent 32%
        ),
        linear-gradient(
            135deg,
            #251440,
            #162d72 55%,
            #0d58ad
        ) !important;

    box-shadow:
        0 24px 60px rgba(0,0,0,.28) !important;
}

.cv-final-box h2{
    color:#ffffff !important;
}

.cv-final-box p{
    color:#cbdaf0 !important;
}

.cv-btn-yellow{
    background:linear-gradient(
        135deg,
        #facc15,
        #ff9f1c
    ) !important;

    color:#171300 !important;
}


/* ==========================================================
   INTRO DE 5 PASSOS
   ========================================================== */

.cv-intro{
    background:#07152f !important;
}

.cv-intro-grid{
    background:
        linear-gradient(
            135deg,
            #0d2a59,
            #0a224a
        ) !important;

    border:1px solid rgba(59,130,246,.45);

    box-shadow:
        0 20px 50px rgba(0,0,0,.24) !important;
}

.cv-intro-grid div{
    border-color:rgba(255,255,255,.09) !important;
}

.cv-intro-grid strong{
    color:#facc15 !important;
}

.cv-intro-grid span{
    color:#ffffff !important;
}


/* ==========================================================
   FOOTER
   ========================================================== */

.cv-footer{
    background:#041022 !important;
    border-top:1px solid rgba(59,130,246,.25);
}


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

@media(max-width:700px){

    .cv-steps{
        padding:0 !important;
    }

    .cv-steps .cv-container{
        padding-top:38px;
        padding-bottom:38px;
    }

    .cv-alerts{
        padding:0 !important;
    }

    .cv-alerts .cv-container{
        padding-top:62px;
        padding-bottom:62px;
    }

    .cv-step-content{
        border-radius:18px !important;
    }

    .cv-alert-grid article{
        border-radius:18px !important;
    }

    .cv-faq-list details{
        border-radius:14px !important;
    }

}

/* ===== FIM TEMA VOTEMAIS ESCURO FINAL ===== */


/* ==========================================================
   COMO VOTAR - CORES ORIGINAIS DO VOTEMAIS
   Baseado no assets/css/style.css atual
   ========================================================== */


/* FUNDO GERAL */

html,
body{
    background:
        radial-gradient(circle at 8% 20%, rgba(255,198,42,.12), transparent 28%),
        radial-gradient(circle at 86% 10%, rgba(37,117,252,.22), transparent 34%),
        linear-gradient(135deg,#2a063f 0%,#111b5e 52%,#1d6fd1 100%) !important;
    color:#fff !important;
}


/* HEADER */

.cv-header{
    background:
        radial-gradient(circle at 8% 20%, rgba(255,198,42,.22), transparent 28%),
        radial-gradient(circle at 86% 10%, rgba(37,117,252,.42), transparent 34%),
        linear-gradient(135deg,#2a063f 0%,#111b5e 52%,#1d6fd1 100%) !important;

    border-bottom:1px solid rgba(255,198,42,.35) !important;

    box-shadow:
        0 16px 40px rgba(7,12,40,.32) !important;
}

.cv-logo{
    color:#fff !important;
}

.cv-logo b{
    color:#ffd33d !important;
}

.cv-back{
    color:#eef5ff !important;
    background:rgba(255,255,255,.08) !important;
    border:1px solid rgba(255,255,255,.13) !important;
}

.cv-back:hover{
    background:rgba(255,255,255,.16) !important;
    border-color:rgba(255,211,61,.45) !important;
}


/* HERO */

.cv-hero{
    background:
        radial-gradient(circle at 12% 18%, rgba(255,211,61,.20), transparent 30%),
        radial-gradient(circle at 86% 12%, rgba(37,117,252,.30), transparent 36%),
        linear-gradient(135deg,#29033f 0%,#121553 50%,#126ed0 100%) !important;

    border-bottom:1px solid rgba(255,211,61,.25) !important;

    box-shadow:
        0 18px 45px rgba(7,12,40,.20) !important;
}

.cv-small-label{
    color:#ffd33d !important;
}

.cv-hero h1{
    color:#fff !important;
    text-shadow:0 14px 34px rgba(0,0,0,.32) !important;
}

.cv-hero h1 strong{
    color:#ffd33d !important;
}

.cv-hero-copy>p{
    color:#eef5ff !important;
}


/* BOTOES HERO */

.cv-btn-main{
    background:#ffd33d !important;
    color:#171225 !important;
    border:2px solid #fff !important;

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

.cv-btn-outline{
    background:rgba(255,255,255,.12) !important;
    border:1px solid rgba(255,255,255,.20) !important;
    color:#fff !important;
}


/* BLOCO 01 / 02 / 03 / 04 / 05 */

.cv-intro{
    background:transparent !important;
}

.cv-intro-grid{
    background:
        radial-gradient(circle at 10% 10%, rgba(255,211,61,.18), transparent 30%),
        linear-gradient(145deg,
            rgba(42,6,63,.98),
            rgba(17,27,94,.98) 55%,
            rgba(18,110,208,.96)
        ) !important;

    border:1px solid rgba(255,211,61,.34) !important;

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

.cv-intro-grid div{
    border-color:rgba(255,255,255,.13) !important;
}

.cv-intro-grid strong{
    color:#ffd33d !important;
}

.cv-intro-grid span{
    color:#fff !important;
}


/* SECOES GERAIS */

.cv-steps,
.cv-alerts,
.cv-faq,
.cv-final{
    background:
        radial-gradient(circle at 12% 10%, rgba(255,198,42,.10), transparent 26%),
        radial-gradient(circle at 90% 5%, rgba(74,222,255,.10), transparent 32%),
        linear-gradient(
            145deg,
            rgba(20,12,49,.98),
            rgba(20,43,118,.98) 56%,
            rgba(7,83,157,.98)
        ) !important;
}


/* TITULOS */

.cv-section-title>span,
.cv-faq-title>span,
.cv-step-tag{
    color:#ffd33d !important;
}

.cv-section-title h2,
.cv-faq-title h2,
.cv-step-text h3{
    color:#fff !important;
}

.cv-section-title p,
.cv-step-text p{
    color:#eef5ff !important;
}


/* CARDS PASSO A PASSO */

.cv-step-content{
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.14),
            rgba(255,255,255,.07)
        ) !important;

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

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10),
        0 16px 36px rgba(0,0,0,.22) !important;

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

.cv-step-number{
    background:
        linear-gradient(
            135deg,
            #3b174f 0%,
            #102a7a 58%,
            #0d74d8 100%
        ) !important;

    color:#fff !important;

    border:1px solid rgba(255,198,42,.45) !important;
}

.cv-step:not(:last-child)::before{
    background:
        linear-gradient(
            180deg,
            rgba(255,211,61,.55),
            rgba(73,175,255,.50)
        ) !important;
}


/* DEMOS INTERNAS */

.cv-demo-browser,
.cv-candidate-demo,
.cv-quantity-demo,
.cv-cart-demo,
.cv-payment-option{
    background:rgba(255,255,255,.10) !important;
    border:1px solid rgba(255,255,255,.16) !important;
    color:#fff !important;
}

.cv-demo-bar{
    background:rgba(255,255,255,.10) !important;
}

.cv-demo-bar i{
    background:rgba(255,255,255,.40) !important;
}

.cv-demo-body{
    background:transparent !important;
}

.cv-demo-title{
    color:#ffd33d !important;
}

.cv-demo-category{
    background:rgba(255,255,255,.09) !important;
    border:1px solid rgba(255,255,255,.18) !important;
    color:#eef5ff !important;
}

.cv-candidate-demo strong,
.cv-cart-demo strong,
.cv-payment-option strong{
    color:#fff !important;
}

.cv-candidate-demo span,
.cv-cart-demo span,
.cv-payment-option span{
    color:#eef5ff !important;
}

.cv-candidate-avatar{
    background:
        linear-gradient(
            135deg,
            #3b174f,
            #102a7a,
            #0d74d8
        ) !important;
}

.cv-candidate-demo button,
.cv-quantity-demo button{
    background:#ffc62a !important;
    color:#101827 !important;
    border:2px solid #fff !important;
}

.cv-quantity-demo strong{
    color:#ffd33d !important;
}


/* PAGAMENTO CONFIRMADO */

.cv-approved{
    background:
        linear-gradient(
            135deg,
            rgba(22,101,52,.65),
            rgba(21,128,61,.35)
        ) !important;

    border:1px solid rgba(134,239,172,.45) !important;
}

.cv-approved strong{
    color:#fff !important;
}

.cv-approved span{
    color:#dcfce7 !important;
}


/* IMPORTANTE */

.cv-alert-grid article{
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.14),
            rgba(255,255,255,.07)
        ) !important;

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

    color:#fff !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10),
        0 14px 30px rgba(0,0,0,.20) !important;
}

.cv-alert-icon{
    background:rgba(255,198,42,.18) !important;
    border:1px solid rgba(255,198,42,.55) !important;
}

.cv-alert-grid h3{
    color:#fff !important;
}

.cv-alert-grid p{
    color:#eef5ff !important;
}


/* FAQ */

.cv-faq-list details{
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.14),
            rgba(255,255,255,.07)
        ) !important;

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

.cv-faq-list summary{
    color:#fff !important;
}

.cv-faq-list summary::after{
    background:rgba(255,198,42,.18) !important;
    border:1px solid rgba(255,198,42,.45) !important;
    color:#ffd33d !important;
}

.cv-faq-list details p{
    color:#eef5ff !important;
}


/* SEPARADORES */

.cv-steps::after,
.cv-faq::before,
.cv-final::before{
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,198,42,.35),
            rgba(74,222,255,.40),
            rgba(255,198,42,.35),
            transparent
        ) !important;
}

.cv-alerts::before,
.cv-faq::after,
.cv-final::after{
    background:
        linear-gradient(
            90deg,
            #ffc62a,
            #4adeff,
            #0d74d8
        ) !important;
}


/* CARD FINAL */

.cv-final-box{
    background:
        radial-gradient(circle at 12% 10%, rgba(255,198,42,.18), transparent 26%),
        radial-gradient(circle at 90% 5%, rgba(74,222,255,.18), transparent 32%),
        linear-gradient(
            145deg,
            rgba(20,12,49,.96),
            rgba(20,43,118,.96) 56%,
            rgba(7,83,157,.96)
        ) !important;

    border:1px solid rgba(255,198,42,.38) !important;

    box-shadow:
        0 24px 60px rgba(0,0,0,.38) !important;
}

.cv-final-box>span{
    background:rgba(255,198,42,.18) !important;
    border:1px solid rgba(255,198,42,.55) !important;
    color:#ffd33d !important;
}

.cv-final-box h2{
    color:#fff !important;
}

.cv-final-box p{
    color:#eef5ff !important;
}

.cv-btn-yellow{
    background:#ffc62a !important;
    color:#101827 !important;
    border:2px solid #fff !important;

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


/* FOOTER */

.cv-footer{
    background:
        radial-gradient(circle at 12% 10%, rgba(255,198,42,.13), transparent 26%),
        linear-gradient(
            90deg,
            #3b174f 0%,
            #102a7a 58%,
            #0d74d8 100%
        ) !important;

    border-top:1px solid rgba(255,198,42,.45) !important;
}

.cv-footer,
.cv-footer a,
.cv-footer p{
    color:#eef5ff !important;
}

.cv-footer strong{
    color:#fff !important;
}


/* MOBILE - MESMO PADRAO DO SITE */

@media(max-width:768px){

    html,
    body{
        background:
            radial-gradient(circle at 12% 10%, rgba(255,198,42,.18), transparent 26%),
            linear-gradient(
                90deg,
                #3b174f 0%,
                #102a7a 58%,
                #0d74d8 100%
            ) !important;
    }

    .cv-header{
        background:
            radial-gradient(circle at 12% 10%, rgba(255,198,42,.18), transparent 26%),
            linear-gradient(
                90deg,
                #3b174f 0%,
                #102a7a 58%,
                #0d74d8 100%
            ) !important;
    }

    .cv-step-content,
    .cv-alert-grid article,
    .cv-faq-list details{
        background:
            linear-gradient(
                135deg,
                rgba(255,255,255,.14),
                rgba(255,255,255,.07)
            ) !important;

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

/* ==========================================================
   FIM CORES ORIGINAIS VOTEMAIS
   ========================================================== */


/* ==========================================================
   CARD DE ETAPAS SOBREPOSTO ENTRE HERO E PROXIMA SECAO
   ========================================================== */

.cv-intro{
    position:relative !important;
    z-index:40 !important;

    /* sobe metade para pegar a hero */
    margin-top:-52px !important;

    /* desce metade para pegar a seção de baixo */
    margin-bottom:-52px !important;

    background:transparent !important;
}

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

.cv-intro-grid{
    position:relative;
    z-index:3;
}

/* compensa o espaço da sobreposição sem usar padding na section */
.cv-steps .cv-container{
    padding-top:95px !important;
}

/* tablet/mobile */
@media(max-width:700px){

    .cv-intro{
        margin-top:-44px !important;
        margin-bottom:-44px !important;
    }

    .cv-steps .cv-container{
        padding-top:82px !important;
    }
}

@media(max-width:430px){

    .cv-intro{
        margin-top:-40px !important;
        margin-bottom:-40px !important;
    }

    .cv-steps .cv-container{
        padding-top:76px !important;
    }
}

/* ==========================================================
   FIM CARD DE ETAPAS SOBREPOSTO
   ========================================================== */


/* ==========================================================
   PAGAMENTO - ICONES E CARDS PREMIUM
   ========================================================== */

.cv-payment-option{
    position:relative;
    overflow:hidden;

    background:
        radial-gradient(
            circle at 8% 20%,
            rgba(255,198,42,.08),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            rgba(255,255,255,.12),
            rgba(255,255,255,.06)
        ) !important;

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

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 10px 24px rgba(0,0,0,.12);

    padding:14px !important;
}

.cv-payment-option::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.03),
            transparent 35%
        );
}

.cv-payment-icon{
    position:relative;
    flex:0 0 auto;

    width:52px !important;
    height:52px !important;

    border-radius:15px !important;

    background:
        linear-gradient(
            145deg,
            rgba(42,6,63,.92),
            rgba(17,27,94,.94) 56%,
            rgba(29,111,209,.86)
        ) !important;

    border:1px solid rgba(255,211,61,.30);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.12),
        0 8px 20px rgba(0,0,0,.20);

    color:#ffd33d !important;
}


/* ==========================================================
   ICONE PIX
   ========================================================== */

.cv-pix-symbol{
    position:relative;
    width:25px;
    height:25px;
    display:block;
    transform:rotate(45deg);
}

.cv-pix-symbol i{
    position:absolute;
    width:10px;
    height:10px;
    border:2px solid #4adeff;
    border-radius:3px;
}

.cv-pix-symbol i:nth-child(1){
    top:0;
    left:7px;
    border-right:0;
    border-bottom:0;
}

.cv-pix-symbol i:nth-child(2){
    top:7px;
    right:0;
    border-left:0;
    border-bottom:0;
}

.cv-pix-symbol i:nth-child(3){
    bottom:0;
    left:7px;
    border-top:0;
    border-left:0;
}

.cv-pix-symbol i:nth-child(4){
    top:7px;
    left:0;
    border-right:0;
    border-top:0;
}

.cv-payment-icon-pix{
    background:
        radial-gradient(
            circle at 30% 30%,
            rgba(74,222,255,.15),
            transparent 45%
        ),
        linear-gradient(
            145deg,
            #25113d,
            #152a73 60%,
            #0d74d8
        ) !important;
}


/* ==========================================================
   ICONE CARTAO
   ========================================================== */

.cv-card-symbol{
    position:relative;
    display:block;
    width:28px;
    height:20px;

    border:2px solid #ffd33d;
    border-radius:4px;
}

.cv-card-symbol::before{
    content:"";
    position:absolute;
    left:-2px;
    right:-2px;
    top:5px;
    height:4px;

    background:#ffd33d;
}

.cv-card-symbol i{
    position:absolute;
    left:4px;
    bottom:3px;

    width:7px;
    height:3px;

    border-radius:2px;
    background:#4adeff;
}

.cv-card-symbol b{
    position:absolute;
    right:4px;
    bottom:3px;

    width:5px;
    height:3px;

    border-radius:2px;
    background:#ffffff;
}

.cv-payment-icon-card{
    background:
        radial-gradient(
            circle at 30% 30%,
            rgba(255,198,42,.15),
            transparent 45%
        ),
        linear-gradient(
            145deg,
            #25113d,
            #1a2b72 60%,
            #0d74d8
        ) !important;
}


/* ==========================================================
   TEXTO
   ========================================================== */

.cv-payment-option strong{
    color:#ffffff !important;
    font-size:13px !important;
}

.cv-payment-option span{
    color:#dbeafe !important;
    font-size:9px !important;
}


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

@media(max-width:700px){

    .cv-payment-icon{
        width:50px !important;
        height:50px !important;
    }

    .cv-payment-option{
        padding:13px !important;
    }

}

/* ==========================================================
   FIM PAGAMENTO PREMIUM
   ========================================================== */


/* ==========================================================
   COMO VOTAR - ANIMACOES E STACK DE CARDS
   ========================================================== */


/* ==========================================================
   1. STACK / PASTAS - ETAPAS 1 A 5
   ========================================================== */

.cv-timeline{
    position:relative;
    display:block !important;
}

/*
 * Somente etapas 1 a 5 entram no efeito de empilhamento.
 * O card final de pagamento aprovado continua normal.
 */
.cv-step:nth-child(-n+5){
    position:sticky !important;
    margin-bottom:75px !important;
}

/* Cada etapa para um pouco abaixo da anterior */
.cv-step:nth-child(1){
    top:88px !important;
    z-index:21;
}

.cv-step:nth-child(2){
    top:100px !important;
    z-index:22;
}

.cv-step:nth-child(3){
    top:112px !important;
    z-index:23;
}

.cv-step:nth-child(4){
    top:124px !important;
    z-index:24;
}

.cv-step:nth-child(5){
    top:136px !important;
    z-index:25;
}


/*
 * Pequena sombra inferior para dar aparência
 * de uma pasta/card passando por cima da outra.
 */
.cv-step:nth-child(-n+5) .cv-step-content{
    box-shadow:
        0 22px 45px rgba(3,7,30,.34),
        inset 0 1px 0 rgba(255,255,255,.11) !important;

    transition:
        transform .38s cubic-bezier(.2,.8,.2,1),
        box-shadow .38s ease,
        border-color .38s ease;
}


/* ==========================================================
   2. ANIMACAO DE ENTRADA AO ROLAR
   ========================================================== */

.cv-reveal{
    opacity:0;
    transform:translateY(34px) scale(.985);

    transition:
        opacity .7s cubic-bezier(.2,.8,.2,1),
        transform .7s cubic-bezier(.2,.8,.2,1);
}

.cv-reveal.cv-reveal-visible{
    opacity:1;
    transform:translateY(0) scale(1);
}


/* etapas: anima somente o conteúdo, sem atrapalhar sticky */

.cv-step .cv-step-content{
    opacity:0;
    transform:translateY(38px) scale(.985);

    transition:
        opacity .65s cubic-bezier(.2,.8,.2,1),
        transform .65s cubic-bezier(.2,.8,.2,1),
        box-shadow .35s ease,
        border-color .35s ease;
}

.cv-step.cv-step-visible .cv-step-content{
    opacity:1;
    transform:translateY(0) scale(1);
}


/* número acompanha a entrada */

.cv-step .cv-step-number{
    opacity:0;
    transform:translateY(22px) scale(.82);

    transition:
        opacity .55s ease,
        transform .55s cubic-bezier(.2,.9,.2,1.2);
}

.cv-step.cv-step-visible .cv-step-number{
    opacity:1;
    transform:translateY(0) scale(1);
}


/* ==========================================================
   3. CARDS IMPORTANTE
   ========================================================== */

.cv-alert-grid article{
    transition:
        transform .35s cubic-bezier(.2,.8,.2,1),
        border-color .35s ease,
        box-shadow .35s ease !important;
}

.cv-alert-grid article:hover{
    transform:translateY(-6px);
    border-color:rgba(255,211,61,.40) !important;

    box-shadow:
        0 22px 42px rgba(0,0,0,.25),
        inset 0 1px 0 rgba(255,255,255,.12) !important;
}


/* ==========================================================
   4. BOTOES
   ========================================================== */

.cv-btn,
.cv-back,
.cv-candidate-demo button,
.cv-quantity-demo button{
    position:relative;
    overflow:hidden;

    transition:
        transform .22s cubic-bezier(.2,.8,.2,1),
        box-shadow .22s ease,
        filter .22s ease !important;
}


/* brilho passando */

.cv-btn::before{
    content:"";
    position:absolute;
    top:-40%;
    bottom:-40%;
    left:-55%;

    width:42%;

    transform:skewX(-22deg);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.36),
            transparent
        );

    transition:left .55s ease;
}

.cv-btn:hover::before{
    left:120%;
}

.cv-btn:hover,
.cv-back:hover{
    transform:translateY(-3px);
}

.cv-btn:active,
.cv-back:active{
    transform:translateY(0) scale(.97);
}


/* botão amarelo principal */

.cv-btn-main:hover,
.cv-btn-yellow:hover{
    box-shadow:
        0 17px 34px rgba(255,198,42,.25),
        0 6px 14px rgba(0,0,0,.18) !important;

    filter:brightness(1.07);
}


/* voltar */

.cv-back:hover{
    background:rgba(255,255,255,.14) !important;
    border-color:rgba(255,211,61,.42) !important;
}


/* ==========================================================
   5. FAQ PREMIUM - ABRIR / FECHAR
   ========================================================== */

.cv-faq-list details{
    overflow:hidden;

    transition:
        height .38s cubic-bezier(.2,.8,.2,1),
        border-color .3s ease,
        background .3s ease,
        box-shadow .3s ease !important;
}

.cv-faq-list details[open]{
    border-color:rgba(255,211,61,.36) !important;

    box-shadow:
        0 14px 30px rgba(0,0,0,.20),
        inset 0 1px 0 rgba(255,255,255,.09) !important;
}


/* pergunta */

.cv-faq-list summary{
    transition:
        color .28s ease,
        transform .28s ease;
}

.cv-faq-list summary:hover{
    color:#ffd33d !important;
}


/* botão + / - */

.cv-faq-list summary::after{
    transition:
        transform .35s cubic-bezier(.2,.8,.2,1),
        background .3s ease,
        color .3s ease !important;
}

.cv-faq-list details[open] summary::after{
    transform:rotate(180deg) scale(1.05);
    background:rgba(255,198,42,.24) !important;
}


/* resposta */

.cv-faq-list details p{
    transform-origin:top;
}

.cv-faq-list details.cv-faq-opening p{
    animation:cvFaqContentIn .38s cubic-bezier(.2,.8,.2,1);
}

.cv-faq-list details.cv-faq-closing p{
    animation:cvFaqContentOut .28s ease forwards;
}

@keyframes cvFaqContentIn{

    from{
        opacity:0;
        transform:translateY(-9px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

@keyframes cvFaqContentOut{

    from{
        opacity:1;
        transform:translateY(0);
    }

    to{
        opacity:0;
        transform:translateY(-8px);
    }

}


/* ==========================================================
   6. CARD FINAL
   ========================================================== */

.cv-final-box{
    transition:
        transform .45s cubic-bezier(.2,.8,.2,1),
        box-shadow .45s ease !important;
}

.cv-final-box.cv-reveal-visible{
    box-shadow:
        0 28px 65px rgba(0,0,0,.32) !important;
}


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

@media(max-width:700px){

    /*
     * Header mobile é menor.
     * Mantemos as pastas com separação menor.
     */

    .cv-step:nth-child(1){
        top:76px !important;
    }

    .cv-step:nth-child(2){
        top:87px !important;
    }

    .cv-step:nth-child(3){
        top:98px !important;
    }

    .cv-step:nth-child(4){
        top:109px !important;
    }

    .cv-step:nth-child(5){
        top:120px !important;
    }

    .cv-step:nth-child(-n+5){
        margin-bottom:62px !important;
    }

}


/* telas pequenas */

@media(max-width:430px){

    .cv-step:nth-child(1){
        top:72px !important;
    }

    .cv-step:nth-child(2){
        top:82px !important;
    }

    .cv-step:nth-child(3){
        top:92px !important;
    }

    .cv-step:nth-child(4){
        top:102px !important;
    }

    .cv-step:nth-child(5){
        top:112px !important;
    }

}


/* ==========================================================
   ACESSIBILIDADE
   ========================================================== */

@media(prefers-reduced-motion:reduce){

    .cv-reveal,
    .cv-step .cv-step-content,
    .cv-step .cv-step-number{
        opacity:1 !important;
        transform:none !important;
        transition:none !important;
    }

    .cv-btn,
    .cv-back,
    .cv-faq-list details,
    .cv-faq-list summary::after{
        transition:none !important;
    }

}

/* ==========================================================
   FIM ANIMACOES E STACK
   ========================================================== */


/* ==========================================================
   AJUSTE ETAPA 5 + FAQ
   ========================================================== */


/* ==========================================================
   ETAPA 5 - EMPILHAR POR CIMA COMO AS OUTRAS
   ========================================================== */

.cv-step:nth-child(5){
    top:128px !important;
    z-index:35 !important;
    margin-bottom:88px !important;
}

/*
 * Garante que o conteúdo da etapa 5
 * tenha presença visual igual às anteriores.
 */
.cv-step:nth-child(5) .cv-step-content{
    position:relative;
    z-index:36;

    box-shadow:
        0 26px 55px rgba(3,7,30,.42),
        inset 0 1px 0 rgba(255,255,255,.11) !important;
}

.cv-step:nth-child(5) .cv-step-number{
    z-index:37;
}


/* mobile */
@media(max-width:700px){

    .cv-step:nth-child(5){
        top:110px !important;
        margin-bottom:78px !important;
    }

}

@media(max-width:430px){

    .cv-step:nth-child(5){
        top:102px !important;
        margin-bottom:72px !important;
    }

}


/* ==========================================================
   FAQ - ENTRADA MAIS VISIVEL NO SCROLL
   ========================================================== */

.cv-faq-list details.cv-reveal{
    opacity:0;
    transform:
        translateY(28px)
        scale(.975);

    filter:blur(3px);

    transition:
        opacity .55s cubic-bezier(.2,.8,.2,1),
        transform .55s cubic-bezier(.2,.8,.2,1),
        filter .55s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}

.cv-faq-list details.cv-reveal.cv-reveal-visible{
    opacity:1;
    transform:
        translateY(0)
        scale(1);

    filter:blur(0);
}


/* efeito escalonado */
.cv-faq-list details:nth-child(1){
    transition-delay:0ms !important;
}

.cv-faq-list details:nth-child(2){
    transition-delay:80ms !important;
}

.cv-faq-list details:nth-child(3){
    transition-delay:160ms !important;
}

.cv-faq-list details:nth-child(4){
    transition-delay:240ms !important;
}


/* pequeno destaque quando entra */
.cv-faq-list details.cv-reveal-visible{
    animation:cvFaqCardIn .55s ease both;
}

@keyframes cvFaqCardIn{

    0%{
        opacity:0;
        transform:
            translateY(30px)
            scale(.97);
    }

    70%{
        opacity:1;
        transform:
            translateY(-3px)
            scale(1.005);
    }

    100%{
        opacity:1;
        transform:
            translateY(0)
            scale(1);
    }

}


/* animação do + / - mais evidente */
.cv-faq-list summary::after{
    transform-origin:center;
}

.cv-faq-list details[open] summary::after{
    transform:
        rotate(180deg)
        scale(1.08) !important;
}


/* resposta aparecendo mais suave */
.cv-faq-list details[open] p{
    animation:cvFaqResposta .34s ease both;
}

@keyframes cvFaqResposta{

    from{
        opacity:0;
        transform:translateY(-8px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media(prefers-reduced-motion:reduce){

    .cv-faq-list details.cv-reveal,
    .cv-faq-list details.cv-reveal-visible{
        opacity:1 !important;
        transform:none !important;
        filter:none !important;
        animation:none !important;
        transition:none !important;
    }

}

/* ==========================================================
   FIM AJUSTE ETAPA 5 + FAQ
   ========================================================== */


/* ==========================================================
   PAGAMENTO APROVADO ACIMA DA ETAPA 5
   ========================================================== */

.cv-step-final{
    position:relative !important;
    z-index:60 !important;
    margin-top:28px !important;
}

.cv-step-final .cv-step-content{
    position:relative !important;
    z-index:61 !important;

    box-shadow:
        0 28px 60px rgba(3,7,30,.38),
        inset 0 1px 0 rgba(255,255,255,.11) !important;
}

.cv-step-final .cv-step-number{
    position:relative !important;
    z-index:62 !important;
}

/* garante que a etapa 5 fique abaixo do aprovado */
.cv-step:nth-child(5){
    z-index:35 !important;
}

.cv-step:nth-child(5) .cv-step-content{
    z-index:36 !important;
}

.cv-step:nth-child(5) .cv-step-number{
    z-index:37 !important;
}

@media(max-width:700px){

    .cv-step-final{
        margin-top:24px !important;
    }

}

/* ==========================================================
   FIM PAGAMENTO APROVADO ACIMA DA ETAPA 5
   ========================================================== */





/* ==========================================================
   FAQ - EFEITO MAQUINA DE ESCREVER
   ========================================================== */

.cv-faq-list details p.cv-digitando::after{
    content:"";
    display:inline-block;

    width:2px;
    height:1em;

    margin-left:3px;

    vertical-align:-2px;

    background:#ffd33d;

    border-radius:2px;

    animation:
        cvCursorDigitando .7s steps(1) infinite;
}

@keyframes cvCursorDigitando{

    0%,
    45%{
        opacity:1;
    }

    46%,
    100%{
        opacity:0;
    }

}

@media(prefers-reduced-motion:reduce){

    .cv-faq-list details p.cv-digitando::after{
        display:none;
    }

}

/* ==========================================================
   FIM FAQ MAQUINA DE ESCREVER
   ========================================================== */


/* ==========================================================
   FAQ - SEM FLASH ANTES DA DIGITACAO
   ========================================================== */

.cv-faq-list details p{
    visibility:hidden;
}

.cv-faq-list details p.cv-digitando,
.cv-faq-list details p.cv-texto-digitado{
    visibility:visible;
}

/* ==========================================================
   FIM FAQ SEM FLASH
   ========================================================== */


/* ==========================================================
   ETAPAS 01 A 05 - ROTACAO SUTIL
   ========================================================== */

.cv-intro-grid > div{
    position:relative;

    opacity:.52;

    transition:
        opacity .45s ease,
        transform .45s cubic-bezier(.2,.8,.2,1),
        background .45s ease,
        box-shadow .45s ease;
}

.cv-intro-grid > div strong,
.cv-intro-grid > div span{
    transition:
        color .45s ease,
        text-shadow .45s ease,
        transform .45s ease;
}


/* etapa ativa */

.cv-intro-grid > div.cv-intro-active{
    opacity:1;

    transform:translateY(-2px) scale(1.025);

    background:
        radial-gradient(
            circle at 50% 20%,
            rgba(255,211,61,.15),
            transparent 68%
        );

    box-shadow:
        inset 0 -2px 0 rgba(255,211,61,.42);
}


/* número ativo */

.cv-intro-grid > div.cv-intro-active strong{
    color:#ffd33d !important;

    text-shadow:
        0 0 12px rgba(255,211,61,.38);
}


/* texto ativo */

.cv-intro-grid > div.cv-intro-active span{
    color:#ffffff !important;

    text-shadow:
        0 0 10px rgba(255,255,255,.15);
}


/* pequeno indicador inferior */

.cv-intro-grid > div::after{
    content:"";

    position:absolute;

    left:50%;
    bottom:-1px;

    width:0;
    height:2px;

    transform:translateX(-50%);

    border-radius:999px;

    background:
        linear-gradient(
            90deg,
            #ffd33d,
            #ffffff,
            #4adeff
        );

    opacity:0;

    transition:
        width .45s ease,
        opacity .45s ease;
}

.cv-intro-grid > div.cv-intro-active::after{
    width:55%;
    opacity:.9;
}


/* MOBILE */

@media(max-width:700px){

    .cv-intro-grid > div.cv-intro-active{
        transform:translateY(-1px) scale(1.02);
    }

    .cv-intro-grid > div.cv-intro-active::after{
        width:48%;
    }

}


/* ACESSIBILIDADE */

@media(prefers-reduced-motion:reduce){

    .cv-intro-grid > div{
        transition:none !important;
    }

    .cv-intro-grid > div.cv-intro-active{
        transform:none !important;
    }

}

/* ==========================================================
   FIM ROTACAO ETAPAS
   ========================================================== */


/* ==========================================================
   ROTACAO 01-05 - VISUAL SUTIL FINAL
   ========================================================== */

.cv-intro-grid > div{
    opacity:.48 !important;
    transform:scale(1) !important;

    background:transparent !important;

    box-shadow:none !important;

    transition:
        opacity .42s ease,
        transform .42s cubic-bezier(.2,.8,.2,1),
        background .42s ease !important;
}


/* remove completamente a barra inferior antiga */
.cv-intro-grid > div::after{
    display:none !important;
}


/* item ativo */
.cv-intro-grid > div.cv-intro-active{
    opacity:1 !important;

    transform:scale(1.035) !important;

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(255,255,255,.075),
            transparent 72%
        ) !important;

    box-shadow:none !important;
}


/* número */
.cv-intro-grid > div strong{
    color:rgba(255,211,61,.55) !important;

    text-shadow:none !important;

    transition:
        color .42s ease,
        transform .42s ease !important;
}

.cv-intro-grid > div.cv-intro-active strong{
    color:#ffd33d !important;

    text-shadow:none !important;

    transform:translateY(-1px);
}


/* texto */
.cv-intro-grid > div span{
    color:rgba(255,255,255,.62) !important;

    text-shadow:none !important;

    transition:
        color .42s ease,
        transform .42s ease !important;
}

.cv-intro-grid > div.cv-intro-active span{
    color:#ffffff !important;

    text-shadow:none !important;

    transform:translateY(-1px);
}


/* mobile */
@media(max-width:700px){

    .cv-intro-grid > div.cv-intro-active{
        transform:scale(1.025) !important;
    }

}


/* acessibilidade */
@media(prefers-reduced-motion:reduce){

    .cv-intro-grid > div{
        transition:none !important;
    }

}

/* ==========================================================
   FIM ROTACAO SUTIL
   ========================================================== */


/* ==========================================================
   ETAPAS 01-05 - VISUAL FINAL LIMPO
   ========================================================== */

/* estado normal */
.cv-intro-grid > div{
    position:relative !important;

    opacity:.45 !important;

    transform:none !important;

    background:none !important;

    box-shadow:none !important;

    filter:none !important;

    transition:
        opacity .35s ease,
        transform .35s cubic-bezier(.2,.8,.2,1) !important;
}


/* mata QUALQUER linha/brilho antigo */
.cv-intro-grid > div::before,
.cv-intro-grid > div::after{
    content:none !important;
    display:none !important;
    width:0 !important;
    height:0 !important;
    background:none !important;
    box-shadow:none !important;
}


/* remove fundo do item ativo */
.cv-intro-grid > div.cv-intro-active{
    opacity:1 !important;

    transform:translateY(-1px) scale(1.025) !important;

    background:none !important;

    box-shadow:none !important;

    filter:none !important;
}


/* ==========================================================
   NUMERO
   ========================================================== */

.cv-intro-grid > div strong{
    display:inline-flex !important;

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

    min-width:30px !important;
    height:25px !important;

    padding:0 7px !important;

    margin:0 auto 4px !important;

    border-radius:999px !important;

    color:rgba(255,211,61,.55) !important;

    background:transparent !important;

    border:1px solid transparent !important;

    box-shadow:none !important;

    text-shadow:none !important;

    transition:
        color .35s ease,
        background .35s ease,
        border-color .35s ease,
        transform .35s ease !important;
}


/* número ativo */
.cv-intro-grid > div.cv-intro-active strong{
    color:#ffd33d !important;

    background:rgba(255,211,61,.12) !important;

    border-color:rgba(255,211,61,.38) !important;

    box-shadow:
        0 0 0 3px rgba(255,211,61,.035) !important;

    transform:scale(1.05) !important;

    text-shadow:none !important;
}


/* ==========================================================
   TEXTO
   ========================================================== */

.cv-intro-grid > div span{
    display:block !important;

    color:rgba(255,255,255,.52) !important;

    text-shadow:none !important;

    transform:none !important;

    transition:
        color .35s ease,
        opacity .35s ease !important;
}

.cv-intro-grid > div.cv-intro-active span{
    color:#ffffff !important;

    text-shadow:none !important;

    transform:none !important;
}


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

@media(max-width:700px){

    .cv-intro-grid > div.cv-intro-active{
        transform:scale(1.015) !important;
    }

    .cv-intro-grid > div strong{
        min-width:27px !important;
        height:23px !important;
        padding:0 6px !important;
    }

}


/* ==========================================================
   FIM VISUAL FINAL
   ========================================================== */








/* ==========================================================
   ALERT CARDS V5 - UNICA ANIMACAO ATIVA
   ========================================================== */


/* DESKTOP: 3 lado a lado */

.cv-alert-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:18px !important;
}


/*
 * Os cards só são escondidos depois que o JS
 * confirma que está funcionando.
 */
.cv-alert-grid.cv-alert-v5-ready article{
    opacity:0 !important;

    transform:
        translateX(-70px)
        scale(.93) !important;

    filter:blur(5px) !important;

    transition:
        opacity .68s cubic-bezier(.16,1,.3,1),
        transform .68s cubic-bezier(.16,1,.3,1),
        filter .68s ease,
        background .35s ease,
        border-color .35s ease,
        box-shadow .35s ease !important;
}


/* VISIVEL */

.cv-alert-grid.cv-alert-v5-ready article.cv-alert-v5-show{
    opacity:1 !important;

    transform:
        translateX(0)
        scale(1) !important;

    filter:blur(0) !important;
}


/* ICONE */

.cv-alert-grid.cv-alert-v5-ready article .cv-alert-icon{
    opacity:0 !important;

    transform:
        translateY(12px)
        scale(.45)
        rotate(-12deg) !important;

    transition:
        opacity .46s ease,
        transform .60s cubic-bezier(.16,1,.3,1) !important;
}

.cv-alert-grid.cv-alert-v5-ready article.cv-alert-v5-show .cv-alert-icon{
    opacity:1 !important;

    transform:
        translateY(0)
        scale(1)
        rotate(0) !important;

    transition-delay:.14s !important;
}


/* TITULO */

.cv-alert-grid.cv-alert-v5-ready article h3{
    opacity:0 !important;
    transform:translateY(16px) !important;

    transition:
        opacity .44s ease,
        transform .50s cubic-bezier(.16,1,.3,1) !important;
}

.cv-alert-grid.cv-alert-v5-ready article.cv-alert-v5-show h3{
    opacity:1 !important;
    transform:translateY(0) !important;
    transition-delay:.20s !important;
}


/* TEXTO */

.cv-alert-grid.cv-alert-v5-ready article p{
    opacity:0 !important;
    transform:translateY(14px) !important;

    transition:
        opacity .44s ease,
        transform .50s cubic-bezier(.16,1,.3,1) !important;
}

.cv-alert-grid.cv-alert-v5-ready article.cv-alert-v5-show p{
    opacity:1 !important;
    transform:translateY(0) !important;
    transition-delay:.28s !important;
}


/* ==========================================================
   HOVER BONITO - COMPUTADOR
   ========================================================== */

@media(hover:hover) and (pointer:fine){

    .cv-alert-grid article.cv-alert-v5-show:hover{

        transform:
            translateY(-9px)
            scale(1.018) !important;

        border-color:
            rgba(255,211,61,.52) !important;

        background:
            radial-gradient(
                circle at 15% 12%,
                rgba(255,211,61,.16),
                transparent 35%
            ),
            radial-gradient(
                circle at 90% 8%,
                rgba(74,222,255,.14),
                transparent 36%
            ),
            linear-gradient(
                135deg,
                rgba(255,255,255,.18),
                rgba(255,255,255,.08)
            ) !important;

        box-shadow:
            0 28px 58px rgba(0,0,0,.30),
            inset 0 1px 0 rgba(255,255,255,.14) !important;
    }


    .cv-alert-grid article.cv-alert-v5-show:hover .cv-alert-icon{

        transform:
            translateY(-3px)
            scale(1.08)
            rotate(2deg) !important;

        border-color:
            rgba(255,211,61,.72) !important;
    }

}


/* ==========================================================
   CELULAR: VERTICAL
   ========================================================== */

@media(max-width:700px){

    .cv-alert-grid{
        grid-template-columns:1fr !important;
        gap:16px !important;
    }


    /*
     * No celular entra de baixo para cima,
     * porque os cards estão na vertical.
     */
    .cv-alert-grid.cv-alert-v5-ready article{

        opacity:0 !important;

        transform:
            translateY(65px)
            scale(.94) !important;

        filter:blur(4px) !important;
    }


    .cv-alert-grid.cv-alert-v5-ready article.cv-alert-v5-show{

        opacity:1 !important;

        transform:
            translateY(0)
            scale(1) !important;

        filter:blur(0) !important;
    }

}


/* ==========================================================
   ACESSIBILIDADE
   ========================================================== */

@media(prefers-reduced-motion:reduce){

    .cv-alert-grid.cv-alert-v5-ready article,
    .cv-alert-grid.cv-alert-v5-ready article .cv-alert-icon,
    .cv-alert-grid.cv-alert-v5-ready article h3,
    .cv-alert-grid.cv-alert-v5-ready article p{

        opacity:1 !important;
        transform:none !important;
        filter:none !important;
        transition:none !important;
    }

}

/* ==========================================================
   FIM ALERT CARDS V5
   ========================================================== */


/* ==========================================================
   ALERT CARDS - RESET PARA ANIMACAO DIRETA
   ========================================================== */

.cv-alert-grid article{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
}

/* garante layout horizontal no computador */
@media(min-width:701px){

    .cv-alert-grid{
        display:grid !important;
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        gap:18px !important;
    }

}

/* e vertical no celular */
@media(max-width:700px){

    .cv-alert-grid{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:16px !important;
    }

}

/* ==========================================================
   FIM RESET ALERT CARDS
   ========================================================== */


/* ==========================================================
   ALERT CARDS - BASE PARA ANIMACAO DO CARD INTEIRO
   ========================================================== */

.cv-alert-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.cv-alert-grid article{
    will-change:transform,opacity,filter;
    transform-origin:center bottom;
}


/* hover continua funcionando depois da entrada */
@media(hover:hover) and (pointer:fine){

    .cv-alert-grid article:hover{
        transform:translateY(-8px) scale(1.015);

        border-color:
            rgba(255,211,61,.52) !important;

        background:
            radial-gradient(
                circle at 15% 12%,
                rgba(255,211,61,.16),
                transparent 35%
            ),
            radial-gradient(
                circle at 90% 8%,
                rgba(74,222,255,.14),
                transparent 36%
            ),
            linear-gradient(
                135deg,
                rgba(255,255,255,.18),
                rgba(255,255,255,.08)
            ) !important;

        box-shadow:
            0 28px 58px rgba(0,0,0,.30),
            inset 0 1px 0 rgba(255,255,255,.14) !important;
    }

}


/* celular = cards na vertical */
@media(max-width:700px){

    .cv-alert-grid{
        grid-template-columns:1fr;
        gap:16px;
    }

}

/* ==========================================================
   FIM BASE CARD INTEIRO
   ========================================================== */


/* ==========================================================
   STACK PASSO A PASSO - CARDS DE TRAS MAIS ESCUROS
   ========================================================== */

.cv-step:nth-child(-n+5) .cv-step-content{
    transition:
        filter .38s ease,
        opacity .38s ease,
        transform .38s cubic-bezier(.2,.8,.2,1),
        box-shadow .38s ease !important;
}


/* ETAPA 1 */
.cv-step:nth-child(1) .cv-step-content{
    filter:brightness(.62) saturate(.85);
    opacity:.82;
}


/* ETAPA 2 */
.cv-step:nth-child(2) .cv-step-content{
    filter:brightness(.68) saturate(.88);
    opacity:.86;
}


/* ETAPA 3 */
.cv-step:nth-child(3) .cv-step-content{
    filter:brightness(.74) saturate(.92);
    opacity:.90;
}


/* ETAPA 4 */
.cv-step:nth-child(4) .cv-step-content{
    filter:brightness(.82) saturate(.95);
    opacity:.94;
}


/* ETAPA 5 = card da frente */
.cv-step:nth-child(5) .cv-step-content{
    filter:brightness(1) saturate(1) !important;
    opacity:1 !important;
}


/* mantém o card da frente mais destacado */
.cv-step:nth-child(5) .cv-step-content{
    box-shadow:
        0 28px 58px rgba(0,0,0,.38),
        inset 0 1px 0 rgba(255,255,255,.12) !important;
}


/* suaviza os números dos cards de trás */
.cv-step:nth-child(1) .cv-step-number{
    filter:brightness(.62);
    opacity:.78;
}

.cv-step:nth-child(2) .cv-step-number{
    filter:brightness(.70);
    opacity:.84;
}

.cv-step:nth-child(3) .cv-step-number{
    filter:brightness(.78);
    opacity:.90;
}

.cv-step:nth-child(4) .cv-step-number{
    filter:brightness(.88);
    opacity:.95;
}

.cv-step:nth-child(5) .cv-step-number{
    filter:brightness(1) !important;
    opacity:1 !important;
}


/* MOBILE */
@media(max-width:700px){

    .cv-step:nth-child(1) .cv-step-content{
        filter:brightness(.60) saturate(.82);
    }

    .cv-step:nth-child(2) .cv-step-content{
        filter:brightness(.67) saturate(.86);
    }

    .cv-step:nth-child(3) .cv-step-content{
        filter:brightness(.75) saturate(.90);
    }

    .cv-step:nth-child(4) .cv-step-content{
        filter:brightness(.84) saturate(.95);
    }

    .cv-step:nth-child(5) .cv-step-content{
        filter:brightness(1) saturate(1) !important;
    }

}

/* ==========================================================
   FIM STACK ESCURECIDO
   ========================================================== */


/* ==========================================================
   STACK PASSO A PASSO - ESCURECIMENTO DINAMICO
   ========================================================== */

/*
 * Normal: todos os cards ficam claros.
 */
.cv-step:nth-child(-n+5) .cv-step-content{
    filter:brightness(1) saturate(1) !important;
    opacity:1 !important;

    transition:
        filter .35s ease,
        opacity .35s ease,
        box-shadow .35s ease,
        transform .35s cubic-bezier(.2,.8,.2,1) !important;
}

.cv-step:nth-child(-n+5) .cv-step-number{
    filter:brightness(1) !important;
    opacity:1 !important;

    transition:
        filter .35s ease,
        opacity .35s ease !important;
}


/*
 * Só recebe esta classe quando outro card
 * está realmente passando por cima dele.
 */
.cv-step.cv-stack-behind .cv-step-content{
    filter:
        brightness(.56)
        saturate(.82) !important;

    opacity:.84 !important;

    box-shadow:
        0 18px 40px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.07) !important;
}

.cv-step.cv-stack-behind .cv-step-number{
    filter:brightness(.62) !important;
    opacity:.82 !important;
}


/*
 * Quanto mais fundo na pilha, mais escuro.
 */
.cv-step.cv-stack-behind-2 .cv-step-content{
    filter:
        brightness(.46)
        saturate(.72) !important;

    opacity:.76 !important;
}

.cv-step.cv-stack-behind-3 .cv-step-content{
    filter:
        brightness(.38)
        saturate(.65) !important;

    opacity:.68 !important;
}


/* card que está na frente continua normal */
.cv-step.cv-stack-front .cv-step-content{
    filter:brightness(1) saturate(1) !important;
    opacity:1 !important;

    box-shadow:
        0 28px 58px rgba(0,0,0,.38),
        inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.cv-step.cv-stack-front .cv-step-number{
    filter:brightness(1) !important;
    opacity:1 !important;
}

/* ==========================================================
   FIM STACK DINAMICO
   ========================================================== */