@import url("./design-system.css");
@import url("./footer-system.css");
@import url("./site-qa.css");

/* -------------------------------------------------------------------------
   Primary navigation — institutional shell (exclude footer <nav>)
   ------------------------------------------------------------------------- */
nav:not(.bh-footer__nav){
  position:sticky;
  top:0;
  z-index:200;
  background-color:var(--bh-bg);
  padding:0 var(--space-section-x);
}

nav:not(.bh-footer__nav)::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:var(--bh-hairline);
  background:linear-gradient(
    90deg,
    rgba(34,162,159,0.35) 0,
    rgba(34,162,159,0.35) min(12%,120px),
    var(--bh-line) min(12%,120px),
    var(--bh-line) 100%
  );
  pointer-events:none;
}

.nav-inner{
  position:relative;
  max-width:var(--bh-max-content);
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:72px;
  gap:var(--bh-space-4);
}

.logo{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:var(--bh-space-3);
  padding:var(--bh-space-1) var(--bh-space-1) var(--bh-space-1) calc(var(--bh-triangle-sm) + var(--bh-space-2));
  font-size:var(--bh-text-sm);
  font-weight:600;
  letter-spacing:0.14em;
  color:var(--bh-text);
  text-decoration:none;
  text-transform:uppercase;
  border-radius:var(--bh-radius-system);
  transition:var(--bh-link-transition);
}

@media (hover:hover){
  .logo:hover{
    color:var(--bh-ink-2);
  }

  .logo:hover span{
    color:var(--bh-ink-3);
  }
}

.logo:focus-visible{
  outline:var(--bh-focus-ring);
  outline-offset:var(--bh-focus-ring-offset);
}

.logo::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:0;
  height:0;
  border-style:solid;
  border-width:6px 0 6px 9px;
  border-color:transparent transparent transparent var(--bh-accent);
  opacity:0.92;
}

.logo span{
  color:var(--bh-text-secondary);
  font-weight:500;
}

.nav-toggle-input{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
  appearance:none;
}

.nav-burger{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  cursor:pointer;
  border:var(--bh-hairline) solid var(--bh-line);
  border-radius:var(--bh-radius-system);
  margin-left:auto;
  flex-shrink:0;
  background:var(--bh-bg);
  transition:
    border-color var(--bh-duration-med) var(--bh-ease-structural),
    background-color var(--bh-duration-med) var(--bh-ease-structural);
}

.nav-burger:hover{
  border-color:var(--bh-line-strong);
  background-color:var(--bh-bg-soft);
}

.nav-burger span{
  display:block;
  width:20px;
  height:var(--bh-hairline);
  background:var(--bh-text);
  margin:0 auto;
}

.nav-links{
  display:flex;
  flex-wrap:wrap;
  gap:clamp(var(--bh-space-3),2.5vw,var(--bh-space-6));
  align-items:center;
}

.nav-links a{
  font-size:var(--bh-text-xs);
  font-weight:500;
  letter-spacing:0.065em;
  color:rgba(17,17,17,0.76);
  padding:var(--bh-space-2) 0;
  text-decoration:none;
  border-bottom:var(--bh-hairline) solid transparent;
  transition:var(--bh-link-transition);
}

.nav-links a:hover{
  color:var(--bh-text);
  border-bottom-color:var(--bh-accent);
  opacity:1;
}

.nav-links a:focus-visible{
  outline:var(--bh-focus-ring);
  outline-offset:var(--bh-focus-ring-offset);
  border-bottom-color:transparent;
}

.nav-links a[aria-current="page"]{
  color:var(--bh-text);
  font-weight:600;
  border-bottom-color:var(--bh-accent);
}

@media (min-width:769px){
  .nav-links a{
    font-size:var(--bh-text-sm);
    letter-spacing:0.062em;
    color:rgba(17,17,17,0.8);
  }
}

@media (max-width:768px){
  .nav-burger{
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .nav-links{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    z-index:210;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:var(--bh-space-2) 0 var(--bh-space-5);
    background-color:var(--bh-bg);
    border-bottom:var(--bh-hairline) solid var(--bh-line);
  }

  .nav-links a{
    padding:var(--bh-space-4) var(--space-section-x);
    border-top:var(--bh-hairline) solid var(--bh-line);
    font-size:var(--bh-text-sm);
    letter-spacing:0.04em;
  }

  .nav-links a:first-of-type{
    border-top:none;
  }

  .nav-links a:hover{
    background-color:var(--bh-bg-soft);
  }

  .nav-toggle-input:checked ~ .nav-links{
    display:flex;
  }
}

@media (min-width:769px){
  .nav-toggle-input,
  .nav-burger{
    display:none!important;
  }

  .nav-links{
    display:flex!important;
  }
}