/* ==========================================================
   QUEM CAMINHA COM VOCÊ
========================================================== */

.profissionais{

    padding:120px 0;

    background:#F7F4EE;

}



/* ==========================================================
   HEADER
========================================================== */

.profissionais .section-header{

    max-width:760px;

    margin:0 auto 70px;

    text-align:center;

}



.profissionais .section-header h2{

    margin:20px 0;

}



.profissionais .section-header p{

    font-size:1.1rem;

    line-height:1.9;

    color:#55636A;

}



/* ==========================================================
   GRID
========================================================== */

.profissionais-grid{

    display:grid;

    grid-template-columns:
        repeat(auto-fit,minmax(330px,1fr));

    gap:40px;

}

/* ==========================================================
   QUEM CAMINHA COM VOCÊ
========================================================== */

.profissionais{

    padding:120px 0;

    background:#F7F4EE;

}



/* ==========================================================
   HEADER
========================================================== */

.profissionais .section-header{

    max-width:760px;

    margin:0 auto 70px;

    text-align:center;

}



.profissionais .section-header h2{

    margin:20px 0;

}



.profissionais .section-header p{

    font-size:1.08rem;

    line-height:1.9;

    color:#55636A;

}



/* ==========================================================
   GRID
========================================================== */

.profissionais-grid{

    display:grid;

    grid-template-columns:
        repeat(auto-fit,minmax(360px,1fr));

    gap:40px;

}



/* ==========================================================
   CARD
========================================================== */

.profissional-card{

    overflow:hidden;

    border-radius:24px;

    background:#FFFFFF;

    box-shadow:
        0 18px 45px rgba(0,0,0,.08);

    transition:
        transform .35s ease,
        box-shadow .35s ease;

}



.profissional-card:hover{

    transform:translateY(-8px);

    box-shadow:
        0 28px 60px rgba(0,0,0,.12);

}



/* ==========================================================
   IMAGEM
========================================================== */

.profissional-imagem{

    position:relative;

    height:320px;

    overflow:hidden;

}



.profissional-imagem img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:transform .6s ease;

}



.profissional-card:hover
.profissional-imagem img{

    transform:scale(1.05);

}



/* ==========================================================
   TIPO
========================================================== */

.profissional-tipo{

    position:absolute;

    top:20px;

    left:20px;

    padding:8px 16px;

    border-radius:100px;

    background:rgba(13,44,58,.92);

    color:#FFFFFF;

    font-size:.82rem;

    font-weight:600;

    backdrop-filter:blur(10px);

}



/* ==========================================================
   CONTEÚDO
========================================================== */

.profissional-info{

    padding:32px;

}



.profissional-cidade{

    display:block;

    margin-bottom:10px;

    color:#7A857C;

    font-size:.92rem;

    text-transform:uppercase;

    letter-spacing:.08em;

}



.profissional-info h3{

    margin-bottom:14px;

    font-size:2rem;

    color:#0D2C3A;

}



.profissional-experiencia{

    margin-bottom:22px;

    font-weight:600;

    color:#3C6E47;

}



.profissional-descricao{

    margin-bottom:30px;

    line-height:1.9;

    color:#55636A;

}



/* ==========================================================
   ESPECIALIDADES
========================================================== */

.profissional-especialidades{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-bottom:35px;

}



.profissional-especialidades span{

    padding:8px 16px;

    border-radius:100px;

    background:#EEF5F1;

    color:#24523C;

    font-size:.9rem;

}



/* ==========================================================
   EXPERIÊNCIAS
========================================================== */

.profissional-trilhas{

    margin-bottom:35px;

}



.profissional-trilhas h4{

    margin-bottom:18px;

    color:#0D2C3A;

}



.profissional-trilhas a{

    display:inline-block;

    margin:0 10px 10px 0;

    padding:10px 16px;

    border-radius:12px;

    background:#F5F5F5;

    color:#0D2C3A;

    text-decoration:none;

    transition:.25s;

}



.profissional-trilhas a:hover{

    background:#0D2C3A;

    color:#FFFFFF;

}



/* ==========================================================
   CONTATOS
========================================================== */

.profissional-redes{

    display:flex;

    flex-wrap:wrap;

    gap:12px;

    padding-top:28px;

    border-top:1px solid #ECECEC;

}



.profissional-redes a{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:10px 18px;

    border-radius:100px;

    background:#0D2C3A;

    color:#FFFFFF;

    text-decoration:none;

    font-size:.9rem;

    transition:.25s;

}



.profissional-redes a:hover{

    transform:translateY(-2px);

    background:#24523C;

}



/* ==========================================================
   RESPONSIVO
========================================================== */

@media(max-width:768px){

    .profissional-info{

        padding:26px;

    }

    .profissional-info h3{

        font-size:1.6rem;

    }

    .profissional-imagem{

        height:260px;

    }

}