.main-header{

  position:fixed;

  top:0;
  left:0;

  width:100%;

  z-index:999;

  padding:16px 5%;

  transition:.35s;
}

.main-header.scrolled{

  background:
  rgba(5,14,28,.78);

  backdrop-filter:blur(18px);

  border-bottom:
  1px solid rgba(255,255,255,.06);

  padding:12px 5%;

  box-shadow:
  0 10px 35px rgba(0,0,0,.22);
}

.navbar{

  max-width:1450px;

  margin:0 auto;

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:24px;
}

.logo-area{

  display:flex;

  align-items:center;
}

.logo{

  width:90px;

  transition:.35s;

  filter:
  drop-shadow(0 15px 35px rgba(0,0,0,.45));
}

.main-header.scrolled .logo{

  width:78px;
}

.nav-links{

  display:flex;

  align-items:center;

  gap:10px;

  padding:8px;

  border-radius:60px;

  background:
  rgba(255,255,255,.05);

  border:
  1px solid rgba(255,255,255,.08);

  backdrop-filter:blur(14px);
}

.nav-links a{

  color:white;

  font-size:15px;

  font-weight:700;

  padding:12px 18px;

  border-radius:40px;

  transition:.35s;
}

.nav-links a:hover{

  background:
  rgba(255,255,255,.06);

  color:var(--dorado);
}

.btn-nav{

  background:
  linear-gradient(
  135deg,
  #ffd65c,
  var(--dorado)
  );

  color:var(--azulOscuro);

  padding:15px 28px;

  border-radius:60px;

  font-weight:900;

  font-size:15px;

  box-shadow:
  0 18px 45px rgba(244,180,0,.24);

  transition:.35s;
}

.btn-nav:hover{

  transform:
  translateY(-3px);

  box-shadow:
  0 25px 60px rgba(244,180,0,.35);
}

@media(max-width:900px){

  .nav-links{
    display:none;
  }

  .btn-nav{
    padding:14px 20px;
    font-size:14px;
  }

  .logo{
    width:74px;
  }

}
.mobile-menu-btn{
    display:none;
}

@media(max-width:900px){

    .mobile-menu-btn{

        display:flex;

        align-items:center;
        justify-content:center;

        width:50px;
        height:50px;

        border:none;

        border-radius:12px;

        background:#f4b400;

        color:#061426;

        font-size:28px;

        font-weight:900;

        cursor:pointer;
    }

    .nav-links{

        display:none;

        position:absolute;

        top:90px;
        left:5%;
        right:5%;

        flex-direction:column;

        gap:8px;

        padding:15px;

        background:#061426;

        border-radius:20px;

        z-index:9999;
    }

    .nav-links.mobile-open{
        display:flex;
    }

    .nav-links a{
        width:100%;
        text-align:center;
    }

}
.mobile-menu-btn{
  display:none !important;
}

@media(max-width:900px){
  .mobile-menu-btn{
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    border:none;
    border-radius:12px;
    background:#f4b400;
    color:#061426;
    font-size:24px;
    font-weight:900;
    cursor:pointer;
  }

  .nav-links{
    display:none;
  }

  .nav-links.mobile-open{
    display:flex;
  }
}