/*==========================================================
JACOB ENGENHARIA 2.0
AREAS-ATENDIDAS.CSS
PARTE 1
==========================================================*/


/*==========================================================
INTRODUÇÃO
==========================================================*/

.areas-intro{

    padding:110px 0;

    background:#ffffff;

}

.areas-intro .servico-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.areas-intro .servico-imagem img{

    width:100%;

    border-radius:24px;

    box-shadow:0 25px 70px rgba(15,23,42,.10);

}

.areas-intro .servico-texto h2{

    font-size:2.7rem;

    color:#0F172A;

    margin:20px 0;

}

.areas-intro .servico-texto p{

    color:#667085;

    line-height:1.9;

    margin-bottom:20px;

}


/*==========================================================
REGIÕES
==========================================================*/

.regioes-atendidas{

    padding:110px 0;

    background:#F8FAFC;

}

.regioes-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

    margin-top:60px;

}

.regiao-card{

    background:#ffffff;

    border-radius:22px;

    padding:35px;

    box-shadow:0 18px 45px rgba(15,23,42,.08);

    transition:.35s;

    border:1px solid #EEF2F6;

}

.regiao-card:hover{

    transform:translateY(-8px);

    box-shadow:0 28px 65px rgba(15,23,42,.12);

}

.regiao-card h3{

    color:#0F172A;

    margin-bottom:20px;

}

.regiao-card p{

    color:#667085;

    line-height:1.9;

    margin-bottom:28px;

}

.regiao-card .btn-secondary{

    width:100%;

    justify-content:center;

}

/*==========================================================
SERVIÇOS NAS REGIÕES
==========================================================*/

.servicos-regioes{

    padding:110px 0;

    background:#ffffff;

}

.servicos-regioes .servicos-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

    margin-top:60px;

}

.servicos-regioes .servico-card{

    background:#F8FAFC;

    border:1px solid #EEF2F6;

    border-radius:22px;

    padding:35px;

    text-align:center;

    transition:.35s;

}

.servicos-regioes .servico-card:hover{

    background:#ffffff;

    transform:translateY(-8px);

    box-shadow:0 25px 60px rgba(15,23,42,.10);

}

.servicos-regioes .servico-card i{

    display:block;

    font-size:3rem;

    color:#D4AF37;

    margin-bottom:22px;

}

.servicos-regioes .servico-card h3{

    color:#0F172A;

    margin-bottom:18px;

}

.servicos-regioes .servico-card p{

    color:#667085;

    line-height:1.8;

}


/*==========================================================
DIFERENCIAIS
==========================================================*/

.porque-regioes{

    padding:110px 0;

    background:#F8FAFC;

}

.porque-regioes .diferenciais-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

    margin-top:60px;

}

.porque-regioes .diferencial-card{

    background:#ffffff;

    border:1px solid #EEF2F6;

    border-radius:22px;

    padding:35px;

    text-align:center;

    transition:.35s;

}

.porque-regioes .diferencial-card:hover{

    transform:translateY(-8px);

    box-shadow:0 25px 60px rgba(15,23,42,.10);

}

.porque-regioes .diferencial-card i{

    display:block;

    font-size:3rem;

    color:#D4AF37;

    margin-bottom:22px;

}

.porque-regioes .diferencial-card h3{

    color:#0F172A;

    margin-bottom:18px;

}

.porque-regioes .diferencial-card p{

    color:#667085;

    line-height:1.8;

}


/*==========================================================
FAQ
==========================================================*/

.faq-area{

    padding:110px 0;

    background:#ffffff;

}

.faq-container{

    max-width:900px;

    margin:60px auto 0;

}

.faq-item{

    background:#F8FAFC;

    border:1px solid #EEF2F6;

    border-radius:18px;

    padding:30px;

    margin-bottom:22px;

}

.faq-item h3{

    color:#0F172A;

    margin-bottom:15px;

}

.faq-item p{

    color:#667085;

    line-height:1.9;

}


/*==========================================================
RESPONSIVO
==========================================================*/

@media(max-width:1200px){

.regioes-grid{

grid-template-columns:repeat(2,1fr);

}

.servicos-regioes .servicos-grid{

grid-template-columns:repeat(2,1fr);

}

.porque-regioes .diferenciais-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:991px){

.areas-intro,
.regioes-atendidas,
.servicos-regioes,
.porque-regioes,
.faq-area{

padding:80px 0;

}

.areas-intro .servico-grid{

grid-template-columns:1fr;

gap:45px;

}

}

@media(max-width:768px){

.regioes-grid,

.servicos-regioes .servicos-grid,

.porque-regioes .diferenciais-grid{

grid-template-columns:1fr;

}

.areas-intro .servico-texto h2{

font-size:2rem;

}

.regiao-card,

.servicos-regioes .servico-card,

.porque-regioes .diferencial-card,

.faq-item{

padding:30px;

}

}

@media(max-width:480px){

.areas-intro .servico-texto h2{

font-size:1.7rem;

}

.servicos-regioes .servico-card i,

.porque-regioes .diferencial-card i{

font-size:2.5rem;

}

}
