/* =====================================
CONTATO - MELHOR PLATAFORMAS
MESMO PADRÃO DO SITE
===================================== */


.pagina-contato{

    width:100%;

    padding:40px 20px;

}



.pagina-titulo{

    margin-bottom:35px;

}


.pagina-titulo h1{

    font-size:38px;

    font-weight:800;

    color:#ffffff;

}



.pagina-titulo p{

    color:#d9ffe8;

    font-size:16px;

}





/* GRID */

.contato-grid{

    max-width:1000px;

    margin:auto;

    display:grid;

    grid-template-columns:

    repeat(2,1fr);

    gap:25px;

}





/* CARDS */


.card-contato{

    background:

    rgba(255,255,255,.12);

    border:

    1px solid rgba(255,255,255,.18);

    border-radius:22px;

    padding:30px;

    backdrop-filter:blur(12px);

    box-shadow:

    0 10px 30px rgba(0,0,0,.25);

    color:white;

    transition:.3s;

}



.card-contato:hover{

    transform:translateY(-8px);

}





.contato-icon{

    width:50px;

    height:50px;

    border-radius:50%;

    background:#00e676;

    color:white;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:22px;

    margin-bottom:15px;

}





.card-contato h2{

    font-size:24px;

    margin-bottom:10px;

}



.card-contato p{

    color:#d9ffe8;

}






/* FORMULARIO */


.form-contato{

    display:flex;

    flex-direction:column;

    gap:15px;

    margin-top:20px;

}



.form-contato input,

.form-contato textarea{


    width:100%;

    border:none;

    outline:none;

    padding:14px;

    border-radius:12px;

    background:white;

    color:#333;

}



.form-contato textarea{

    height:120px;

    resize:none;

}





.form-contato button{


    border:none;

    padding:15px;

    border-radius:15px;

    background:#00e676;

    color:white;

    font-weight:700;

    cursor:pointer;

    transition:.3s;

}



.form-contato button:hover{

    transform:scale(1.05);

}





/* INFORMAÇÕES */


.info-item{

    display:flex;

    gap:15px;

    align-items:center;

    margin:20px 0;

}



.info-item i{

    color:#00e676;

    font-size:20px;

}



.info-item strong{

    color:white;

}





/* ESTATISTICAS */


.contato-estatisticas{


    max-width:1000px;

    margin:35px auto;


    display:grid;

    grid-template-columns:

    repeat(4,1fr);


    gap:15px;


}



.estatistica-card{


    background:white;


    border-radius:15px;


    padding:20px;


    text-align:center;


    box-shadow:

    0 8px 20px rgba(0,0,0,.2);


}




.estatistica-card strong{


    display:block;


    font-size:28px;


    color:#087f35;


}




.estatistica-card span{


    color:#555;


}





/* MOBILE */


@media(max-width:768px){


.pagina-contato{

padding:20px 10px;

}



.contato-grid{


grid-template-columns:1fr;


}



.contato-estatisticas{


grid-template-columns:

repeat(2,1fr);


}



.pagina-titulo h1{


font-size:28px;


}



}





@media(max-width:450px){


.contato-estatisticas{


grid-template-columns:1fr;


}


}

/* =====================================
ANIMAÇÕES PREMIUM
===================================== */


.card-contato{

    animation:

    aparecer .8s ease forwards;

    opacity:0;

}



.card-contato:nth-child(1){

    animation-delay:.2s;

}



.card-contato:nth-child(2){

    animation-delay:.4s;

}





@keyframes aparecer{


from{

    opacity:0;

    transform:

    translateY(40px);

}



to{

    opacity:1;

    transform:

    translateY(0);

}



}







/* BRILHO DOS CARDS */


.card-contato::before{


content:"";


position:absolute;


inset:0;


border-radius:22px;


background:

linear-gradient(

90deg,

transparent,

rgba(0,255,120,.35),

transparent

);



opacity:0;


transition:.5s;


}



.card-contato:hover::before{


opacity:1;


}





.card-contato{


position:relative;

overflow:hidden;


}





/* BOTÃO PREMIUM */


.form-contato button{


position:relative;


overflow:hidden;


}




.form-contato button::after{


content:"";


position:absolute;


top:0;


left:-100%;


width:100%;


height:100%;


background:


linear-gradient(

90deg,

transparent,

rgba(255,255,255,.5),

transparent

);



transition:.5s;


}




.form-contato button:hover::after{


left:100%;


}





/* ESTATISTICAS PREMIUM */


.estatistica-card{


transition:.3s;


cursor:pointer;


}



.estatistica-card:hover{


transform:

translateY(-8px);


box-shadow:

0 15px 35px rgba(0,255,120,.35);


}






/* TITULO COM DESTAQUE */


.pagina-titulo h1{


position:relative;


display:inline-block;


}



.pagina-titulo h1::after{


content:"";


position:absolute;


bottom:-10px;


left:0;


width:60%;


height:4px;


background:#00e676;


border-radius:10px;


}








/* MOBILE MELHORADO */


@media(max-width:768px){



.card-contato{


padding:20px;


}



.card-contato h2{


font-size:20px;


}



.form-contato button{


font-size:15px;


}



}