/* =========================================
   01 - HEADER / NAVBAR
   Prefixo isolado: ce-header
========================================= */

.ce-header{

  /* VARIÁVEIS DO HEADER */
  --text-white:#FFFFFF;
  --text-secondary:#94A3B8;
  --neon-green:#00F5A0;
  --cyan:#22D3EE;
  --bg-dark:#020F1E;
  --border-dark:#1E293B;

  position:fixed;
  top:0;
  width:100%;
  z-index:9999;

  background:rgba(11,18,32,0.75);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border-dark);

  font-family:'Inter',system-ui,-apple-system,sans-serif;
  line-height:1.6;
  color:var(--text-white);
}


/* =========================================
   CONTAINER
========================================= */

.ce-header-container{
  max-width:1200px;
  margin:auto;
  padding:18px 24px;

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


/* LINKS */

.ce-header a{
  text-decoration:none;
  color:inherit;
  transition:all .3s ease;
}


/* =========================================
   LOGO
========================================= */

.ce-header-logo{
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:800;
  font-size:1.25rem;
}

.ce-header-logo img{
  height:36px;
  max-width:100%;
  display:block;
}

.ce-header-logo span{

   background: linear-gradient(135deg, #00BF62, #7CFFB6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

 


/* =========================================
   MENU
========================================= */
/* =========================================
   MENU
========================================= */

.ce-header-menu{
  display:flex;
  gap:34px;
}

.ce-header-menu a{
  font-size:0.95rem;
  font-weight:500;
  color:var(--text-secondary);

  position:relative;

  transition:color .25s ease;
}

/* HOVER */

.ce-header-menu a:hover{
  color:var(--neon-green);
}

/* LINHA ANIMADA */

.ce-header-menu a::after{

  content:"";
  position:absolute;

  left:0;
  bottom:-6px;

  width:0%;
  height:2px;

  background:var(--neon-green);

  transition:width .25s ease;

}

/* ATIVA A LINHA */

.ce-header-menu a:hover::after{
  width:100%;
}


/* =========================================
   BOTÃO MOBILE
========================================= */

.ce-header-mobile-btn{
  display:none;
  background:none;
  border:none;
  color:var(--text-white);
  font-size:1.6rem;
  cursor:pointer;
}


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

@media (max-width:1024px){

.ce-header-menu{
  display:none;

  position:absolute;
  top:100%;
  left:0;
  right:0;

  background:var(--bg-dark);
  flex-direction:column;
  padding:22px;

  border-top:1px solid var(--border-dark);
}

.ce-header-menu.active{
  display:flex;
}

.ce-header-mobile-btn{
  display:block;
}

.ce-header-menu a{
  padding:12px 0;
  font-size:1rem;
}

}


/* MOBILE */

@media (max-width:600px){

.ce-header-container{
  padding:16px 18px;
}

.ce-header-logo span{
  font-size:1.05rem;
}

.ce-header-logo img{
  height:30px;
}

}