body{
font-family: 'Open Sans', Arial, sans-serif;
margin:0;
background:#f4f4f4;
}

header{
background:#151F2C;
padding:10px 50px;
}

.topo{
display:flex;
align-items:center;
justify-content:space-between;
}

.logo img{
height:100px;
width:auto;
border:1px solid rgba(7, 7, 7, 0.6);
border-radius:8px;
transition:transform 0.3s ease;
}

.logo img:hover{
transform:scale(1.20);
}

nav ul{
display:flex;
gap:40px;
list-style:none;
}

nav a{
color:white;
text-decoration:none;
font-weight:bold;
font-size:18px;
transition:0.3s;
}

nav a:hover{
color:#4da3ff;
}

.carousel{
width:100%;
overflow:hidden;
text-align:center;
}

.slides{
position:relative;
}

.slide{
display:none;
flex-direction:column;
align-items:center;
gap:20px;
padding:40px;
}

.slide.active{
display:flex;
}

.titulo-slide{
font-size:30px;
color:#0c1c33;
margin-bottom:10px;
font-weight:bold;
}

.titulo-slide::after{
content:"";
display:block;
width:80px;
height:3px;
background:#0c1c33;
margin:10px auto;
}

.imagens-slide{
display:flex;
gap:20px;
justify-content:center;
flex-wrap:wrap;
}

.imagens-slide img{
width:420px;
height:280px;
object-fit:cover;
border-radius:8px;
transition:transform 0.3s;
}

.imagens-slide img:hover{
transform:scale(1.05);
}

.section{
padding:60px 80px;
text-align:center;
}

.gray{
background:#eaeaea;
}

.cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
gap:30px;
margin-top:30px;
}

.card{
background:white;
padding:25px;
border-radius:8px;
box-shadow:0 0 10px rgba(0,0,0,0.1);
}

footer{
background:#151F2C;
color:white;
text-align:center;
padding:20px;
}


.form-contato{
max-width:600px;
margin:30px auto;
display:flex;
flex-direction:column;
gap:15px;
}

.linha-campos{
display:flex;
gap:15px;
}

.linha-campos input{
flex:1;
}

.form-contato input,
.form-contato textarea{
padding:12px;
border-radius:6px;
border:1px solid #ccc;
font-family:'Open Sans', Arial, sans-serif;
font-size:16px;
width:100%;
}

.form-contato textarea{
resize:none;
height:100px;
}

.form-contato button{
background:#151F2C;
color:white;
border:none;
padding:12px;
font-size:16px;
font-weight:bold;
border-radius:6px;
cursor:pointer;
transition:0.3s;
}

.form-contato button:hover{
background:#4da3ff;
}

p{
margin-bottom:10px;
}



.vagas-container{
text-align:center;
margin:60px 0;
}

.botao-vagas{
background:#0c1c33;
color:white;
padding:18px 35px;
font-size:20px;
font-weight:bold;
text-decoration:none;
border-radius:8px;
display:inline-block;
transition:0.3s;
animation:pulsar 2s infinite;
}

.botao-vagas:hover{
background:#4da3ff;
transform:scale(1.08);
}

@keyframes pulsar{

0%{
box-shadow:0 0 0 0 rgba(77,163,255,0.7);
}

70%{
box-shadow:0 0 0 20px rgba(77,163,255,0);
}

100%{
box-shadow:0 0 0 0 rgba(77,163,255,0);
}

}

.vagas-container{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:30px;
margin-top:40px;

}

.vaga{

background:white;
padding:25px;
border-radius:8px;
box-shadow:0 0 10px rgba(0,0,0,0.1);
text-align:center;
transition:0.3s;

}

.vaga:hover{

transform:translateY(-5px);

}

.vaga h3{

color:#0c1c33;
margin-bottom:10px;

}

.botao-vaga{

background:#151F2C;
color:white;
border:none;
padding:10px 20px;
border-radius:6px;
cursor:pointer;
margin-top:10px;
font-weight:bold;

}

.botao-vaga:hover{

background:#4da3ff;

}

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

@media (max-width: 768px) {

  /* HEADER */
  header {
    padding: 10px 20px;
  }

  .topo {
    flex-direction: column;
    gap: 15px;
  }

  .logo img {
    height: 70px;
  }

  /* MENU */
  nav ul {
    flex-direction: column;
    gap: 15px;
    align-items: center;
    padding: 0;
  }

  nav a {
    font-size: 16px;
  }

  /* SLIDE */
  .titulo-slide {
    font-size: 22px;
  }

  .slide {
    padding: 20px;
  }

  .imagens-slide img {
    width: 100%;
    height: auto;
  }

  /* SEÇÕES */
  .section {
    padding: 40px 20px;
  }

  /* TEXTO */
  p {
    font-size: 15px;
  }

  /* FORM */
  .linha-campos {
    flex-direction: column;
  }

  /* BOTÃO VAGAS */
  .botao-vagas {
    font-size: 16px;
    padding: 14px 20px;
  }

}

/* BOTÃO HAMBURGUER */
.menu-toggle {
  display: none;
  font-size: 30px;
  color: white;
  cursor: pointer;
}

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

  .menu-toggle {
    display: block;
  }

  nav {
    width: 100%;
  }

  nav ul {
    display: none;
    flex-direction: column;
    background: #151F2C;
    width: 100%;
    text-align: center;
    padding: 20px 0;
  }

  nav ul.active {
    display: flex;
  }

  nav ul li {
    padding: 10px 0;
  }