/* HEADER */
.site-header{
  position: sticky;
  top: 32px;
  z-index: 80;
}

.header-outer{
  padding: 0; /* desktop: no extra top spacing */
  border-radius: 28px;
  transition: background .25s ease, backdrop-filter .25s ease;
  position: relative;
}

.header-desktop{ display:block; }
.header-mobile{ display:none; }

.header-pill{
  width: 846px;
  height: 82px;
  margin: 0 auto;
  padding: 16px;
  border-radius: 24px;
  background: var(--header-bg);
  backdrop-filter: blur(var(--blur));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.nav-btn{
  width:150px;
  height:50px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-decoration:none;
  color:#fff;
  font-weight:600;
  font-size:16px;
  background: transparent;
  transition: transform .15s ease, background .15s ease;
}
.nav-btn:hover{ transform: translateY(-4px); background: #00000059;}
.nav-btn.is-active{ background: var(--accent); }

.nav-btn.is-cta{ position:relative; }
.nav-btn.is-cta::before{
  content:"";
  position:absolute;
  inset:0;
  padding:1px;
  border-radius:16px;
  background: linear-gradient(90deg, var(--outline-left), var(--outline-mid), var(--outline-right));
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}
.nav-btn.is-cta{ background: transparent; }
.nav-btn.is-cta.is-active{ background: var(--accent); }
.nav-btn.is-contact-outline{ position:relative; background:transparent; }
.nav-btn.is-contact-outline::before{
  content:"";
  position:absolute;
  inset:0;
  padding:1px;
  border-radius:16px;
  background: linear-gradient(90deg, var(--outline-left), var(--outline-mid), var(--outline-right));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}

.nav-logo{ width:25px;height:25px; display:inline-flex; align-items:center; justify-content:center; }
.nav-logo img{ width:25px;height:25px; display:block; }



/* FINAL OVERRIDE: desktop Contact active */
.nav-btn.is-contact-outline.is-active{
  background: var(--accent) !important;
  color:#fff !important;
}
