.navbar{
  position:fixed;
  inset:0 0 auto 0;
  width:100%;
  z-index:999;
  background:rgba(251,251,253,.72);
  border-bottom:1px solid rgba(0,0,0,.06);
  backdrop-filter:saturate(180%) blur(20px);
}

.navbar a{
  text-decoration:none;
}

.navbar .container{
  width:min(1180px, calc(100% - 48px));
  margin-inline:auto;
}

.nav-wrapper{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:64px;
}

.logo{
  display:flex;
  align-items:center;
}

.logo img{
  width:118px;
  display:block;
}

.nav-menu{
  display:flex;
  align-items:center;
  gap:30px;
}

.nav-menu a{
  color:rgba(29,29,31,.78);
  font-size:.92rem;
  font-weight:500;
  letter-spacing:-.012em;
  transition:color .22s ease;
}

.nav-menu a:hover{
  color:#0071e3;
}

.nav-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:10px 18px;
  border-radius:999px;
  background:#0071e3;
  color: #fff;
  font-size:.9rem;
  font-weight:650;
  letter-spacing:-.015em;
  transition:transform .25s ease, background .25s ease, box-shadow .25s ease;
}

.nav-cta:hover{
  transform:translateY(-1px);
  background:#0071e3;
  color: #fff;
  box-shadow:0 12px 30px rgba(0,113,227,.24);
}

.hamburger{display:none;}

@media (max-width: 980px){
  .nav-menu,
  .nav-cta{display:none;}

  .hamburger{
    width:42px;
    height:42px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    border:1px solid rgba(0,0,0,.08);
    border-radius:999px;
    background:rgba(255,255,255,.68);
    cursor:pointer;
    backdrop-filter:blur(14px);
  }

  .hamburger span{
    width:18px;
    height:2px;
    display:block;
    border-radius:999px;
    background:#1d1d1f;
    transition:.25s ease;
  }

  .nav-menu.active{
    position:absolute;
    top:76px;
    left:16px;
    right:16px;
    display:grid;
    gap:4px;
    padding:14px;
    border-radius:24px;
    background:rgba(251,251,253,.92);
    border:1px solid rgba(0,0,0,.08);
    box-shadow:0 26px 80px rgba(0,0,0,.15);
    backdrop-filter:saturate(180%) blur(24px);
  }

  .nav-menu.active a{
    padding:14px 15px;
    border-radius:16px;
    color:#1d1d1f;
  }

  .nav-menu.active a:hover{
    background:rgba(0,113,227,.08);
  }
}