@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Poppins", sans-serif;
}

body {
    background-color: #f4f4f4;
}

  /* Section 1 */
  
  .banner { display: flex; align-items: center; justify-content: flex-end; padding: 40px 270px; height: 500px; /* Substitua pelo nome real da imagem do banner */ background-size: cover; background-position: center; position: relative; color: #fff; } .texto-banner { max-width: 570px; text-align: center; } .texto-banner p { font-size: 45px; line-height: 1; font-weight: bold; color: white; } .letreiro{ text-align: center; margin-top: 35px; margin-bottom: 30px; } .letreiro h1 span { font-size: 57px; color: #ffc800; line-height: 1; } .texto-banner h2 { font-size: 20px; line-height: 1.2; color: white; font-weight: 400; }


/* CARROSSEL SLIDE - simples e profissional */
.banner-carousel{
  position: relative;
  overflow: hidden;
}

/* viewport do carrossel */
.banner-carousel__viewport{
  overflow: hidden;
}

.banner-carousel__track{
  display:flex;
  transform: translateX(0);
  will-change: transform;
}
.banner-carousel .banner{ flex: 0 0 100%; }
.banner-carousel__track.is-animating{
  transition: transform 650ms cubic-bezier(.22,.61,.36,1);
}

/* botões discretos */
.banner-carousel__btn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(0,0,0,.25);
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
}

.banner-carousel__btn:hover{
  background: rgba(0,0,0,.40);
}

.banner-carousel__btn--prev{ left: 14px; }
.banner-carousel__btn--next{ right: 14px; }

/* dots */
.banner-carousel__dots{
  position: absolute;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  display: inline-flex;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.12);
  z-index: 5;
}

.banner-carousel__dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.35);
  background: rgba(255,255,255,.20);
  cursor: pointer;
  padding: 0;
}

.banner-carousel__dot.is-active{
  background: rgba(255,255,255,.90);
  border-color: rgba(255,255,255,.90);
}

/* mobile: ajusta seu banner sem quebrar o layout */
@media (max-width: 900px){
  .banner{
    padding: 30px 18px !important;
    height: 420px !important;
    justify-content: center;
  }
  .texto-banner{
    max-width: 560px;
  }
}

/* acessibilidade */
@media (prefers-reduced-motion: reduce){
  .banner-carousel__track.is-animating{
    transition: none !important;
  }
}



/* Section 2 */

.cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  padding: 40px;
}
@media (max-width: 1000px) {
  .cards {
    grid-template-columns: repeat(2, 1fr);
  }
    .banner{
      display: none;
  }
}
@media (max-width: 500px) {
  .cards {
    grid-template-columns: repeat(1, 1fr);
    padding: 20px;
  }
}

.card {
  height: 230px;
  background-size: cover;
  background-position: right top;
  position: relative;
  cursor: pointer;
  text-decoration: none;
  color: white;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-radius: 5px; /* Opcional: canto arredondado leve */
}

.card:hover {
  transform: scale(1.03);
}

.card .overlay {
  background: rgba(0, 0, 0, 0.192);
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 20px;
  border-radius: 5px; /* Opcional: canto arredondado leve */
}

.card h2 {
  font-size: 25px;
  font-weight: bold;
  text-align: left;
  color: white;
  line-height: 1.3;
}

.card h2 span {
  color: #ffc800;
}


/* Section 3 - negocios */
.negocios-section{
  position:relative;
  overflow:hidden;
  padding:46px 28px 28px;
  background:
    radial-gradient(circle at 12% 18%, rgba(0,126,255,.30), transparent 26%),
    radial-gradient(circle at 86% 10%, rgba(0,126,255,.28), transparent 28%),
    linear-gradient(180deg, #001949 0%, #031b46 54%, #f4f9ff 100%);
  text-align:center;
}

.negocios-section::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg, transparent 0%, rgba(0,132,255,.16) 18%, transparent 34%),
    linear-gradient(315deg, transparent 0%, rgba(0,132,255,.20) 14%, transparent 30%);
  opacity:.75;
  pointer-events:none;
}

.negocios-container{
  position:relative;
  z-index:2;
  width:100%;
  max-width:1500px;
  margin:0 auto;
}

.negocios-header{
  margin-bottom:35px;
}

.negocios-header h2{
  margin:0;
  color:#fff;
  font-size:50px;
  line-height:1.03;
  font-weight:600;
  letter-spacing:-1.8px;
  text-transform:uppercase;
  text-shadow:0 8px 24px rgba(0,0,0,.28);
}

.negocios-header h2 span{
  color:#006dff;
}

.negocios-header p{
  margin:8px 0 0;
  color:rgba(255,255,255,.92);
  font-size:20px;
  line-height:1.35;
  font-weight:500;
}

.negocios-cards{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:14px;
  justify-content:center;
}

.negocio-card{
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  min-height:264px;
  overflow:hidden;
  border:1px solid rgba(170,210,255,.68);
  border-radius:16px;
  background:#fff;
  color:#061b49;
  text-decoration:none;
  box-shadow:0 18px 36px rgba(0,31,88,.22);
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    border-color .22s ease;
}

.negocio-card:hover{
  transform:translateY(-3px);
  border-color:rgba(0,117,255,.9);
  box-shadow:0 24px 44px rgba(0,78,180,.24);
}

.negocio-card-img{
  width:100%;
  height:166px;
  overflow:hidden;
  background:#061b49;
}

.negocio-card-img img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:
    transform .35s ease,
    filter .3s ease;
}

.negocio-card:hover .negocio-card-img img{
  transform:scale(1.035);
  filter:saturate(1.04) contrast(1.03);
}

.negocio-card-content{
  min-height:108px;
  display:grid;
  grid-template-columns:54px minmax(0, 1fr);
  gap:15px;
  align-items:center;
  padding:18px 18px;
  background:linear-gradient(180deg, #ffffff 0%, #f2f7ff 100%);
  text-align:left;
}

.negocio-card-icon{
  width:48px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:15px;
  background:linear-gradient(135deg, #0078ff, #004ee8);
  color:#fff;
  box-shadow:0 8px 18px rgba(0,93,255,.32);
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    filter .22s ease;
}

.negocio-card:hover .negocio-card-icon{
  transform:translateY(-2px) scale(1.035);
  box-shadow:0 12px 24px rgba(0,93,255,.36);
  filter:drop-shadow(0 8px 14px rgba(0,109,255,.16));
}

.negocio-card-icon svg{
  width:25px;
  height:25px;
}

.negocio-card-content strong{
  display:block;
  margin:0;
  color:#061b49;
  font-size:16px;
  line-height:1.22;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:-.2px;
}

.negocio-card-content span:not(.negocio-card-icon):not(.negocio-card-arrow){
  display:block;
  margin-top:6px;
  color:#405275;
  font-size:13px;
  line-height:1.38;
  font-weight:400;
  text-transform:none;
}

.negocio-card-arrow{
  display:none !important;
}

/* Brilho sutil preso dentro do card */
.negocio-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  background:linear-gradient(
    120deg,
    transparent 0%,
    transparent 38%,
    rgba(255,255,255,.34) 50%,
    transparent 62%,
    transparent 100%
  );
  transform:translateX(-140%);
  opacity:0;
  pointer-events:none;
}

.negocio-card > *{
  position:relative;
  z-index:2;
}

.negocio-card:hover::after{
  animation:edCardLight .58s ease forwards;
}

@keyframes edCardLight{
  0%{
    opacity:0;
    transform:translateX(-140%);
  }

  18%{
    opacity:.65;
  }

  100%{
    opacity:0;
    transform:translateX(140%);
  }
}

@media(max-width:1080px){
  .negocios-cards{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .negocios-header h2{
    font-size:42px;
  }
}

@media(max-width:760px){
  .negocios-section{
    padding:36px 14px 26px;
  }

  .negocios-header{
    margin-bottom:26px;
  }

  .negocios-header h2{
    font-size:30px;
    line-height:1.08;
    letter-spacing:-.8px;
  }

  .negocios-header p{
    font-size:15px;
  }

  .negocios-cards{
    grid-template-columns:1fr;
    gap:12px;
  }

  .negocio-card{
    min-height:auto;
    border-radius:14px;
  }

  .negocio-card-img{
    height:148px;
  }

  .negocio-card-content{
    min-height:96px;
    grid-template-columns:48px minmax(0, 1fr);
    gap:13px;
    padding:16px;
  }

  .negocio-card-icon{
    width:44px;
    height:44px;
    border-radius:13px;
  }

  .negocio-card-icon svg{
    width:23px;
    height:23px;
  }

  .negocio-card-content strong{
    font-size:15px;
  }

  .negocio-card-content span:not(.negocio-card-icon):not(.negocio-card-arrow){
    font-size:12.5px;
    line-height:1.36;
  }
}

/* Section 4 - materias */

.materias-section{
  position:relative;
  overflow:hidden;
  padding:14px 28px 54px;
  background:#fff;
  color:#061b49;
}

.materias-section::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg, rgba(0,105,255,.08) 0%, transparent 28%),
    linear-gradient(315deg, rgba(0,105,255,.08) 0%, transparent 30%);
  pointer-events:none;
}

.materias-container{
  position:relative;
  z-index:2;
  width:100%;
  max-width:1500px;
  margin:0 auto;
}

.materias-panel{
  padding:28px 32px 30px;
  border:1px solid rgba(0,96,255,.25);
  border-radius:18px;
  background:rgba(255,255,255,.88);
  box-shadow:0 18px 42px rgba(0,39,94,.13);
}

.materias-header{
  text-align:center;
  margin-bottom:24px;
}

.materias-header h2{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin:0;
  color:#061b49;
  font-size:40px;
  line-height:1.05;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:-1px;
}

.materias-header h2::before,
.materias-header h2::after{
  content:"";
  width:60px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, transparent, #006dff);
}

.materias-header h2::after{
  background:linear-gradient(90deg, #006dff, transparent);
}

.materias-header h2 span{
  color:#006dff;
}

.materias-header p{
  margin:5px 0 0;
  color:#5b6b89;
  font-size:18px;
  line-height:1.35;
  font-weight:500;
}

.materias-columns{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.materias-column{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
}

.materia-list-card{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:42% minmax(0, 1fr);
  align-items:stretch;
  min-height:138px;
  overflow:hidden;
  border:1px solid rgba(0,96,255,.18);
  border-radius:16px;
  background:#fff;
  color:#061b49;
  text-decoration:none;
  box-shadow:0 12px 28px rgba(0,42,105,.12);
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    border-color .22s ease;
}

.materia-list-card:hover{
  transform:translateY(-3px);
  border-color:rgba(0,96,255,.42);
  box-shadow:0 18px 34px rgba(0,68,155,.16);
}

.materia-list-card > *{
  position:relative;
  z-index:2;
}

.materia-list-card img{
  width:100%;
  height:100%;
  min-height:138px;
  object-fit:cover;
  display:block;
  transition:
    transform .35s ease,
    filter .3s ease;
}

.materia-list-card:hover img{
  transform:scale(1.035);
  filter:saturate(1.04) contrast(1.03);
}

.materia-list-content{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:18px 20px;
  text-align:left;
  background:linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%);
}

.materia-list-content h3{
  margin:0 0 8px;
  color:#061b49;
  font-size:16px;
  line-height:1.22;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:-.2px;
}

.materia-list-content p{
  margin:0;
  color:#39506f;
  font-size:13.5px;
  line-height:1.42;
  font-weight:400;
}

.materia-list-arrow{
  display:none !important;
}

/* Brilho sutil preso dentro do card */
.materia-list-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  background:linear-gradient(
    120deg,
    transparent 0%,
    transparent 38%,
    rgba(255,255,255,.34) 50%,
    transparent 62%,
    transparent 100%
  );
  transform:translateX(-140%);
  opacity:0;
  pointer-events:none;
}

.materia-list-card:hover::after{
  animation:edMateriaLight .58s ease forwards;
}

@keyframes edMateriaLight{
  0%{
    opacity:0;
    transform:translateX(-140%);
  }

  18%{
    opacity:.65;
  }

  100%{
    opacity:0;
    transform:translateX(140%);
  }
}

.materias-vazio{
  width:100%;
  padding:40px 20px;
  border:1px solid rgba(0,96,255,.18);
  border-radius:14px;
  background:#fff;
  text-align:center;
  color:#061b49;
  font-size:17px;
  font-weight:600;
}

.materias-btn-wrapper{
  margin-top:22px;
  display:flex;
  justify-content:center;
}

.materias-btn{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-width:380px;
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  padding:0 32px;
  border-radius:9px;
  background:linear-gradient(135deg, #006dff, #004de8);
  color:#fff;
  font-size:18px;
  line-height:1;
  font-weight:600;
  text-decoration:none;
  text-transform:uppercase;
  box-shadow:0 12px 26px rgba(0,86,255,.28);
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    filter .22s ease;
}

.materias-btn:hover{
  transform:translateY(-2px);
  filter:brightness(1.035);
  box-shadow:0 16px 32px rgba(0,86,255,.34);
}

.materias-btn svg{
  width:24px;
  height:24px;
  flex:0 0 auto;
  transition:transform .22s ease;
}

.materias-btn:hover svg{
  transform:translateX(4px);
}

.materias-btn::before{
  content:"";
  position:absolute;
  top:-40%;
  bottom:-40%;
  left:-70%;
  width:48%;
  z-index:1;
  background:linear-gradient(
    120deg,
    transparent 0%,
    rgba(255,255,255,.08) 28%,
    rgba(255,255,255,.52) 50%,
    rgba(255,255,255,.10) 72%,
    transparent 100%
  );
  transform:skewX(-18deg);
  opacity:0;
  pointer-events:none;
}

.materias-btn:hover::before{
  animation:edMateriaBtnLight .62s ease forwards;
}

.materias-btn > *{
  position:relative;
  z-index:2;
}

@keyframes edMateriaBtnLight{
  0%{
    left:-70%;
    opacity:0;
  }

  18%{
    opacity:.72;
  }

  100%{
    left:124%;
    opacity:0;
  }
}

@media (max-width:1200px){
  .materias-columns{
    grid-template-columns:1fr;
  }

  .materias-column{
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width:760px){
  .materias-section{
    padding:10px 14px 38px;
  }

  .materias-panel{
    padding:22px 14px 24px;
    border-radius:16px;
  }

  .materias-header{
    margin-bottom:20px;
  }

  .materias-header h2{
    gap:10px;
    font-size:29px;
    line-height:1.08;
    letter-spacing:-.6px;
  }

  .materias-header h2::before,
  .materias-header h2::after{
    width:30px;
  }

  .materias-header p{
    font-size:14.5px;
  }

  .materias-columns{
    grid-template-columns:1fr;
    gap:13px;
  }

  .materias-column{
    grid-template-columns:1fr;
    gap:13px;
  }

  .materia-list-card{
    grid-template-columns:1fr;
    min-height:auto;
    border-radius:14px;
  }

  .materia-list-card img{
    height:150px;
    min-height:auto;
  }

  .materia-list-content{
    min-height:auto;
    padding:16px;
  }

  .materia-list-content h3{
    font-size:16px;
  }

  .materia-list-content p{
    font-size:13.5px;
  }

  .materias-btn{
    width:100%;
    min-width:0;
    min-height:46px;
    padding:0 18px;
    font-size:14px;
  }

  .materias-btn svg{
    width:21px;
    height:21px;
  }
}

@media (max-width:480px){
  .materias-header h2{
    font-size:25px;
  }

  .materias-header h2::before,
  .materias-header h2::after{
    width:22px;
  }

  .materia-list-card img{
    height:145px;
  }
}

/* =========================================================
   BANCO DE EMPREGOS — HERO (idêntico ao layout do exemplo)
   Troque o caminho da imagem abaixo para o seu arquivo.
   ========================================================= */
:root{
  --be-navy:#061b49;
  --be-blue:#006dff;
  --be-blue-dark:#004ed8;
  --be-green:#13a74f;
  --be-green-dark:#07863b;
  --be-text:#52617f;
  --be-border:rgba(0,96,255,.16);
  --be-shadow:0 22px 50px rgba(0,42,105,.12);
}

.banco-empregos-hero{
  position:relative;
  overflow:hidden;
  width:100%;
  padding:20px 28px 50px;
  background:#fff;
}

.banco-empregos-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg, rgba(0,109,255,.08) 0%, transparent 24%),
    linear-gradient(315deg, rgba(0,109,255,.08) 0%, transparent 26%),
    radial-gradient(circle at 92% 45%, rgba(0,109,255,.07), transparent 24%);
  pointer-events:none;
}

.banco-empregos-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    radial-gradient(rgba(0,109,255,.14) 1px, transparent 1px);
  background-size:14px 14px;
  opacity:.16;
  mask-image:linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%);
  pointer-events:none;
}

.be-container{
  position:relative;
  z-index:2;
  width:100%;
  max-width:1640px;
  margin:0 auto;
}

.be-header{
  max-width:860px;
  margin:0 auto 34px;
  text-align:center;
}

.be-header-icon{
  width:42px;
  height:42px;
  margin:0 auto 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--be-blue);
}

.be-header-icon svg{
  width:40px;
  height:40px;
}

.be-header h2{
  margin:0;
  color:var(--be-navy);
  font-size:50px;
  line-height:1.02;
  font-weight:800;
  text-transform:uppercase;
  text-shadow:0 3px 0 rgba(255,255,255,.75);
}

.be-subtitle{
  color:#4c5876;
  font-size:26px;
  line-height:1.25;
}

.be-header-line{
  width:104px;
  height:2px;
  display:block;
  margin:18px auto 16px;
  border-radius:999px;
  background:linear-gradient(90deg, transparent, var(--be-blue), transparent);
}

.be-description{
  margin:0;
  color:#53617d;
  font-size:17px;
  line-height:1.45;
  font-weight:500;
}

.be-description strong{
  color:var(--be-blue);
  font-weight:900;
}

.be-cards{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:stretch;
}

.be-card{
  min-height:420px;
  display:grid;
  grid-template-columns:51% 49%;
  overflow:hidden;
  border:1px solid rgba(0,65,150,.16);
  border-radius:13px;
  background:#fff;
  box-shadow:var(--be-shadow);
}

.be-card-content{
  position:relative;
  z-index:2;
  padding:28px 30px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:linear-gradient(90deg, #fff 0%, rgba(255,255,255,.96) 72%, rgba(255,255,255,.62) 100%);
}

.be-card-icon{
  width:58px;
  height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  margin-bottom:18px;
  background:#fff;
}

.be-card-icon svg{
  width:34px;
  height:34px;
}

.be-card-icon-green{
  color:var(--be-green);
  border:2px solid var(--be-green);
}

.be-card-icon-blue{
  color:var(--be-blue-dark);
  border:2px solid var(--be-blue-dark);
}

.be-card h3{
  position:relative;
  margin:0 0 28px;
  color:var(--be-navy);
  font-size:25px;
  line-height:1.12;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:-.4px;
}

.be-card h3::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-13px;
  width:54px;
  height:3px;
  border-radius:999px;
}

.be-card-empresa h3::after{
  background:var(--be-green);
}

.be-card-funcionario h3::after{
  background:var(--be-blue);
}

.be-card h3 span{
  color:var(--be-blue);
}

.be-card-empresa h3 span{
  color:var(--be-green);
}

.be-card-content > p{
  max-width:360px;
  margin:0 0 26px;
  color:var(--be-text);
  font-size:16px;
  line-height:1.56;
  font-weight:500;
}

.be-list{
  display:flex;
  flex-direction:column;
  gap:16px;
  list-style:none;
  margin:0 0 28px;
  padding:0;
}

.be-list li{
  display:flex;
  align-items:center;
  gap:13px;
  color:#4d5874;
  font-size:15px;
  line-height:1.25;
  font-weight:700;
}

.be-list li span{
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  flex:0 0 36px;
  color:#fff;
}

.be-card-empresa .be-list li span{
  background:linear-gradient(135deg, var(--be-green), var(--be-green-dark));
}

.be-card-funcionario .be-list li span{
  background:linear-gradient(135deg, var(--be-blue), var(--be-blue-dark));
}

.be-list svg{
  width:19px;
  height:19px;
}

.be-main-btn{
  width:100%;
  max-width:340px;
  min-height:58px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  border-radius:6px;
  color:#fff;
  text-decoration:none;
  font-size:15px;
  line-height:1;
  font-weight:500;
  text-transform:uppercase;
  box-shadow:0 14px 28px rgba(0,0,0,.14);
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.be-main-btn:hover{
  transform:translateY(-2px);
  filter:brightness(1.04);
  box-shadow:0 18px 34px rgba(0,0,0,.18);
}

.be-main-btn svg{
  width:20px;
  height:20px;
  flex:0 0 auto;
}

.be-main-btn-green{
  background:linear-gradient(135deg, var(--be-green), var(--be-green-dark));
}

.be-main-btn-blue{
  background:linear-gradient(135deg, var(--be-blue), var(--be-blue-dark));
}

.be-card-image{
  position:relative;
  min-height:420px;
  overflow:hidden;
}

.be-card-image::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
}

.be-card-empresa .be-card-image::before{
  background:linear-gradient(90deg, rgba(255,255,255,.56), rgba(255,255,255,0) 34%);
}

.be-card-funcionario .be-card-image::before{
  background:linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,0) 40%);
}

.be-card-image img{
  width:100%;
  height:100%;
  min-height:420px;
  display:block;
  object-fit:cover;
}

.be-floating{
  position:absolute;
  z-index:2;
  display:grid;
  grid-template-columns:36px 1fr;
  gap:12px;
  align-items:center;
  max-width:210px;
  padding:14px 16px;
  border-radius:6px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,65,150,.10);
  box-shadow:0 16px 30px rgba(0,30,80,.16);
}

.be-floating span{
  width:32px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--be-blue);
}

.be-floating-empresa span{
  color:var(--be-green);
}

.be-floating svg{
  width:29px;
  height:29px;
}

.be-floating p{
  margin:0;
  color:#53617d;
  font-size:13px;
  line-height:1.3;
  font-weight:500;
}

.be-floating-empresa{
  right:20px;
  top:45%;
  transform:translateY(-50%);
}

.be-floating-funcionario{
  right:24px;
  bottom:50px;
}

@media (max-width:1280px){
  .be-header h2{
    font-size:48px;
  }

  .be-cards{
    gap:24px;
  }

  .be-card{
    grid-template-columns:52% 48%;
  }

  .be-card-content{
    padding:26px 24px;
  }

  .be-card h3{
    font-size:22px;
  }
}

@media (max-width:1020px){
  .banco-empregos-hero{
    padding:44px 18px 54px;
  }

  .be-cards{
    grid-template-columns:1fr;
    max-width:820px;
    margin:0 auto;
  }

  .be-card{
    min-height:auto;
  }

  .be-card-image,
  .be-card-image img{
    min-height:360px;
  }
}

@media (max-width:760px){
  .banco-empregos-hero{
    padding:36px 14px 42px;
  }

  .be-header{
    margin-bottom:26px;
  }

  .be-header-icon{
    width:34px;
    height:34px;
    margin-bottom:6px;
  }

  .be-header-icon svg{
    width:33px;
    height:33px;
  }

  .be-header h2{
    font-size:34px;
    letter-spacing:1.8px;
  }

  .be-subtitle{
    font-size:19px;
    margin-top:10px;
  }

  .be-description{
    font-size:14.5px;
  }

  .be-cards{
    gap:18px;
  }

  .be-card{
    grid-template-columns:1fr;
    border-radius:14px;
  }

  .be-card-content{
    padding:24px 20px 22px;
  }

  .be-card-icon{
    width:52px;
    height:52px;
    margin-bottom:16px;
  }

  .be-card-icon svg{
    width:30px;
    height:30px;
  }

  .be-card h3{
    font-size:22px;
    margin-bottom:24px;
  }

  .be-card-content > p{
    max-width:none;
    font-size:15px;
    margin-bottom:22px;
  }

  .be-list{
    gap:13px;
    margin-bottom:24px;
  }

  .be-main-btn{
    max-width:none;
    min-height:54px;
    font-size:14px;
  }

  .be-card-image{
    order:-1;
  }

  .be-card-image,
  .be-card-image img{
    min-height:260px;
  }

  .be-floating{
    max-width:190px;
    padding:12px 13px;
  }

  .be-floating-empresa{
    right:14px;
    top:auto;
    bottom:20px;
    transform:none;
  }

  .be-floating-funcionario{
    right:14px;
    bottom:20px;
  }
}

@media (max-width:480px){
  .be-header h2{
    font-size:28px;
    letter-spacing:1px;
  }

  .be-subtitle{
    font-size:17px;
  }

  .be-header-line{
    margin:14px auto 13px;
  }

  .be-card-image,
  .be-card-image img{
    min-height:220px;
  }

  .be-card h3{
    font-size:20px;
  }

  .be-card-content{
    padding:22px 17px 20px;
  }

  .be-floating{
    grid-template-columns:30px 1fr;
    max-width:170px;
    gap:9px;
  }

  .be-floating span{
    width:28px;
    height:28px;
  }

  .be-floating svg{
    width:25px;
    height:25px;
  }

  .be-floating p{
    font-size:12px;
  }
}

/* Section 6 */

/* SECTION 2 - Logos dos apoiadores */
.nossos-apoiadores {
  padding: 25px 40px;
  background-color: #001d3b;
  text-align: center;
}

.nossos-apoiadores h2 {
  font-size: 25px;
  color: #dbe4f0;
  margin-bottom: 10px;
  text-align: left;
  font-weight: 600;
}

.logos-apoiadores {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  justify-items: center;
  align-items: center;
}

.logos-apoiadores img {
  max-width: 120px;
  height: auto;
  padding: 10px;
}

@media (max-width: 900px) {
.logos-apoiadores {
  grid-template-columns: repeat(auto-fit, minmax(70px, 1fr));
  gap: 25px;

}

.logos-apoiadores img {
  max-width: 100px;
  height: auto;
  padding: 10px;
}

@media (max-width: 900px) {
  .navbar {
    flex-direction: column;
}

  .logo-p p {
    font-size: 11px;
}
 
.titulo-escritorio {
    color: #fff;
    font-size: 26px;
    font-weight: 700;
    text-transform: uppercase;
    margin-top: 25px;
}

.texto-2 h2 {
    display: flex;
    font-size: 29px;
    margin-bottom: 5px;
    line-height: 1.2;
    color: #002f6c;
    border-bottom: 2px solid #002f6c;
}

.empregos-texto h2 {
    display: none;
}



.empregos-texto p {
    font-size: 15px;
    text-align: center;
}

.botao-cadastro {
    padding: 14px 24px;
}

.botao-cadastro p{
    color: #fff;
    font-size: 14px;
}
.botao-cadastro-2 {
    padding: 14px 30px;
}

.botao-cadastro p{
    color: #fff;
    font-size: 14px;
}
.banco-empregos {
    flex-wrap: wrap;
    text-align: center;
    gap: 10px;
    padding: 30px 25px;
}

.negocios-section {
    background-color: #dbe4f0;
}

.texto-ideia {
    background-color: #dbe4f0;
}

.texto-ideia h2 {
    font-size: 25px;
}

.materias-titulo {
    font-size: 25px;
}

.nossos-apoiadores{
    display: none;
}
}

}