/* ==========================================================

   CAPITÓLIO PROMOÇÕES

   Frontend v1.0

========================================================== */



body{

    background:#f5f7fa;

}



/*========================================================*/



.cp-promocao,

.cp-sucesso{



    width:100%;

    max-width:820px;



    margin:50px auto;



    background:#FFF;



    border-radius:18px;



    padding:50px;



    box-sizing:border-box;



    box-shadow:

        0 10px 40px rgba(0,0,0,.06);



}



/*========================================================*/



.cp-promocao h2,

.cp-sucesso h2{



    margin:0;



    text-align:center;



    color:#003B78;



    font-size:36px;



    font-weight:700;



}



.cp-promocao p,

.cp-sucesso p{



    margin:20px auto 40px;



    max-width:650px;



    text-align:center;



    color:#666;



    font-size:19px;



    line-height:32px;



}



.cp-promocao strong{



    color:#003B78;



}



/*========================================================*/



.cp-campo{



    margin-bottom:30px;



}



.cp-campo label{



    display:block;



    margin-bottom:10px;



    color:#333;



    font-size:17px;



    font-weight:600;



}



/*========================================================*/



.cp-campo input[type=text],

.cp-campo input[type=email],

.cp-campo input[type=file]{



    width:100%;



    padding:17px 20px;



    font-size:17px;



    border-radius:10px;



    border:1px solid #D8DDE6;



    background:#FFF;



    box-sizing:border-box;



    transition:.25s;



}



.cp-campo input[type=file]{



    padding:15px;



}



.cp-campo input:hover{



    border-color:#9CB6D8;



}



.cp-campo input:focus{



    outline:none;



    border-color:#003B78;



    box-shadow:



    0 0 0 5px rgba(0,59,120,.10);



}



/*========================================================*/



.cp-checkbox{



    margin:35px 0;



}



.cp-checkbox label{



    display:flex;



    align-items:flex-start;



    gap:12px;



    cursor:pointer;



    font-size:16px;



    line-height:26px;



    color:#555;



}



.cp-checkbox input{



    margin-top:5px;



    transform:scale(1.25);



}



/*========================================================*/



.cp-botao{



    width:100%;



    height:65px;



    border:none;



    border-radius:10px;



    background:#C62828;



    color:#FFF;



    font-size:20px;



    font-weight:700;



    cursor:pointer;



    transition:.25s;



}



.cp-botao:hover{



    background:#A91F1F;



    transform:translateY(-2px);



    box-shadow:



    0 8px 25px rgba(198,40,40,.25);



}



/*========================================================*/



.cp-alerta{



    padding:20px;



    margin-bottom:30px;



    border-radius:10px;



    font-size:17px;



    font-weight:600;



}



.cp-erro{



    background:#FDEDED;



    border:1px solid #F5BDBD;



    color:#B71C1C;



}



/*========================================================*/



.cp-check{



    width:95px;



    height:95px;



    border-radius:50%;



    background:#1FAE5B;



    color:#FFF;



    display:flex;



    align-items:center;



    justify-content:center;



    font-size:46px;



    margin:0 auto 25px;



}



/*========================================================*/



.cp-lista{



    display:flex;



    flex-wrap:wrap;



    justify-content:center;



    gap:18px;



    margin:40px 0;



}



.cp-numero{



    min-width:145px;



    background:#003B78;



    color:#FFF;



    padding:18px 25px;



    border-radius:10px;



    font-size:24px;



    font-weight:700;



    text-align:center;



    letter-spacing:2px;



    box-shadow:



    0 6px 18px rgba(0,0,0,.12);



}



/*========================================================*/



.cp-whatsapp{



    display:inline-block;



    margin-top:10px;



    background:#25D366;



    color:#FFF;



    text-decoration:none;



    padding:18px 40px;



    border-radius:10px;



    font-size:19px;



    font-weight:700;



    transition:.25s;



}



.cp-whatsapp:hover{



    background:#1DB955;



    color:#FFF;



    transform:translateY(-2px);



}



/*========================================================*/



.cp-sucesso .button{



    margin-top:20px;



}



/*========================================================*/



@media(max-width:768px){

    .cp-promocao,
    .cp-sucesso{
        display:block;
        width:calc(100% - 24px);
        max-width:520px;
        margin:16px auto !important;
        padding:24px 20px;
        box-sizing:border-box;
        float:none;
        position:relative;
        left:auto;
        right:auto;
    }

    .cp-promocao h2,
    .cp-sucesso h2{
        font-size:28px;
        line-height:34px;
        text-align:center;
    }

    .cp-promocao p,
    .cp-sucesso p{
        font-size:16px;
        line-height:25px;
        text-align:center;
    }

    .cp-campo{
        width:100%;
        margin:0 0 22px 0;
        text-align:left;
        box-sizing:border-box;
    }

    .cp-campo label{
        display:block;
        width:100%;
        margin-bottom:8px;
        font-size:16px;
        line-height:22px;
        text-align:left;
    }

    .cp-campo input[type=text],
    .cp-campo input[type=email],
    .cp-campo input[type=file],
    .cp-campo input{
        display:block;
        width:100%;
        max-width:100%;
        min-width:0;
        margin:0;
        padding:15px 16px;
        font-size:16px;
        line-height:22px;
        box-sizing:border-box;
    }

    .cp-checkbox{
        width:100%;
        margin:28px 0;
        text-align:left;
        box-sizing:border-box;
    }

    .cp-checkbox label{
        width:100%;
        text-align:left;
        align-items:flex-start;
        gap:10px;
        font-size:15px;
        line-height:23px;
    }

    .cp-checkbox input{
        flex:0 0 auto;
        margin-top:4px;
    }

    .cp-botao{
        display:block;
        width:100%;
        height:58px;
        margin:8px 0 0;
        padding:0 18px;
        border-radius:10px;
        background:#C62828;
        color:#FFF;
        font-size:18px;
        font-weight:700;
        line-height:58px;
        text-align:center;
        box-sizing:border-box;
        box-shadow:0 5px 16px rgba(198,40,40,.20);
        -webkit-appearance:none;
        appearance:none;
    }

    .cp-botao:hover,
    .cp-botao:active{
        background:#A91F1F;
        transform:none;
        box-shadow:0 5px 16px rgba(198,40,40,.25);
    }

    .cp-numero{
        width:100%;
        min-width:unset;
        box-sizing:border-box;
    }

    .cp-whatsapp{
        display:block;
        width:100%;
        text-align:center;
        box-sizing:border-box;
        margin-left:auto;
        margin-right:auto;
    }
}



.cp-promocao h2,

.cp-sucesso h2{



    font-size:30px;



}



.cp-promocao p,

.cp-sucesso p{



    font-size:17px;



    line-height:28px;



}



.cp-campo label{



    font-size:16px;



}



.cp-campo input{



    font-size:16px;



}



.cp-numero{



    width:100%;



    min-width:unset;



}



.cp-whatsapp{



    width:100%;



    text-align:center;



    box-sizing:border-box;



}



.cp-botao{



    font-size:18px;



}



}

/* ==========================================================
   BOTÃO CADASTRAR OUTRO CUPOM
   ========================================================== */

.cp-sucesso a.cp-cadastrar-outro,
.cp-sucesso .cp-cadastrar-outro{
    display:block;
    width:calc(100% - 16px);
    max-width:400px;
    margin:28px auto 8px;
    padding:17px 24px;
    box-sizing:border-box;
    border:0;
    border-radius:12px;
    background:#C62828;
    color:#FFF;
    text-align:center;
    text-decoration:none;
    font-size:18px;
    font-weight:700;
    line-height:24px;
    box-shadow:0 6px 18px rgba(198,40,40,.20);
    transition:.25s ease;
}

.cp-sucesso a.cp-cadastrar-outro:hover,
.cp-sucesso .cp-cadastrar-outro:hover{
    background:#A91F1F;
    color:#FFF;
    transform:translateY(-2px);
    box-shadow:0 9px 24px rgba(198,40,40,.26);
}

@media(max-width:768px){
    .cp-sucesso a.cp-cadastrar-outro,
    .cp-sucesso .cp-cadastrar-outro{
        display:block;
        width:calc(100% - 8px);
        max-width:400px;
        margin:30px auto 6px !important;
        padding:16px 18px;
        font-size:17px;
        line-height:23px;
        border-radius:11px;
        box-sizing:border-box;
    }
}


/* ==========================================================
   AJUSTE FINAL MOBILE — CENTRALIZAÇÃO DO LAYOUT
   ========================================================== */

@media screen and (max-width: 768px){

    html,
    body{
        width:100%;
        max-width:100%;
        margin:0;
        padding:0;
        overflow-x:hidden;
    }

    .cp-promocao,
    .cp-sucesso{
        display:block !important;
        position:relative !important;
        float:none !important;
        left:auto !important;
        right:auto !important;
        width:calc(100% - 32px) !important;
        max-width:520px !important;
        margin:24px auto !important;
        padding:28px 20px !important;
        box-sizing:border-box !important;
        transform:none !important;
    }

    .cp-campo{
        display:block !important;
        width:100% !important;
        margin-left:0 !important;
        margin-right:0 !important;
        text-align:left !important;
        box-sizing:border-box !important;
    }

    .cp-campo label{
        display:block !important;
        width:100% !important;
        text-align:left !important;
        box-sizing:border-box !important;
    }

    .cp-campo input,
    .cp-campo input[type="text"],
    .cp-campo input[type="email"],
    .cp-campo input[type="file"]{
        display:block !important;
        width:100% !important;
        max-width:none !important;
        margin-left:0 !important;
        margin-right:0 !important;
        box-sizing:border-box !important;
    }

    /* Botão principal */
    .cp-botao{
        display:block !important;
        width:100% !important;
        margin:12px auto 0 !important;
        box-sizing:border-box !important;
    }

    /* CADASTRAR OUTRO CUPOM */
    .cp-sucesso a.cp-cadastrar-outro,
    .cp-sucesso .cp-cadastrar-outro{
        display:block !important;
        position:relative !important;
        float:none !important;
        left:auto !important;
        right:auto !important;
        width:calc(100% - 4px) !important;
        max-width:440px !important;
        min-height:62px !important;
        margin:34px auto 12px !important;
        padding:19px 26px !important;
        box-sizing:border-box !important;
        border:0 !important;
        border-radius:12px !important;
        background:#C62828 !important;
        color:#FFFFFF !important;
        text-align:center !important;
        text-decoration:none !important;
        font-size:18px !important;
        font-weight:700 !important;
        line-height:24px !important;
        box-shadow:0 7px 20px rgba(198,40,40,.24) !important;
        transform:none !important;
    }

    .cp-sucesso a.cp-cadastrar-outro:hover,
    .cp-sucesso .cp-cadastrar-outro:hover,
    .cp-sucesso a.cp-cadastrar-outro:active,
    .cp-sucesso .cp-cadastrar-outro:active{
        background:#A91F1F !important;
        color:#FFFFFF !important;
        transform:none !important;
    }
}