/* ═══════════════════════════════════════
   SITE NAV — Unified Navigation Component
   Used on every page. Requires theme.css for CSS variables.
═══════════════════════════════════════ */

.site-nav{
  position:sticky;top:0;z-index:500;
  height:64px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 28px;
  background:var(--t-nav-bg);
  border-bottom:1px solid var(--t-border-green);
  font-family:'Jost',sans-serif;
}

/* Landing variant — transparent at top, solid on scroll */
.site-nav--landing{
  position:fixed;left:0;right:0;
  background:transparent;
  border-bottom-color:transparent;
  transition:background .4s,border-bottom-color .4s;
}
.site-nav--landing.solid{
  background:var(--t-nav-bg);
  border-bottom-color:var(--t-border-green);
}
/* Light mode — always solid, no transparent phase */
html.light .site-nav--landing{
  background:var(--t-nav-bg);
  border-bottom-color:var(--t-border-green);
}

/* ── Logo ── */
.site-nav__logo{
  display:flex;align-items:center;gap:10px;
  text-decoration:none;color:var(--t-text);flex-shrink:0;
}
.site-nav__logo img{
  width:52px;height:52px;object-fit:contain;
  filter:var(--t-logo-filter);
}
.site-nav__logo span{display:none}

/* ── Right cluster (links + CTA + toggle + hamburger) ── */
.site-nav__right{
  display:flex;align-items:center;gap:14px;margin-left:auto;
}

/* ── Desktop links ── */
.site-nav__links{
  display:flex;gap:20px;align-items:center;list-style:none;
  margin:0;padding:0;
}
.site-nav__links a{
  font-size:.72rem;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:var(--t-text-50);
  text-decoration:none;transition:color .2s;
  white-space:nowrap;padding-bottom:2px;position:relative;
}
.site-nav__links a:hover{color:var(--t-text)}
.site-nav__links a[aria-current="page"]{color:var(--green-l)}
.site-nav__links a::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:1px;
  background:var(--green-l);transform:scaleX(0);transform-origin:left;
  transition:transform .24s;
}
.site-nav__links a:hover::after{transform:scaleX(1)}
.site-nav__links a[aria-current="page"]::after{transform:scaleX(1)}

/* CTA button */
.site-nav__links .site-nav__cta,
.site-nav__cta{
  background:var(--green);color:#fff!important;
  padding:7px 18px 8px;border-radius:3px;
  font-size:.68rem;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;text-decoration:none!important;
  transition:background .2s;white-space:nowrap;
  display:inline-flex;align-items:center;justify-content:center;
  line-height:1.2;
}
.site-nav__cta:hover{background:var(--green-l)}
.site-nav__cta::after{display:none!important}

/* Mobile-only Apply button (condensed) */
.site-nav__mobile-cta{
  display:none;
  background:var(--green);color:#fff!important;
  padding:6px 12px;border-radius:2px;
  font-size:.62rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;text-decoration:none;
  transition:background .2s;
}
.site-nav__mobile-cta:hover{background:var(--green-l)}

/* Hamburger */
.site-nav__hamburger{
  display:none;flex-direction:column;gap:4px;
  cursor:pointer;padding:4px;background:none;border:none;
}
.site-nav__hamburger span{
  width:22px;height:1.5px;background:var(--t-text-70);display:block;
  transition:all .25s;
}
.site-nav__hamburger.open span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.site-nav__hamburger.open span:nth-child(2){opacity:0}
.site-nav__hamburger.open span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}

/* ── Mobile drawer ── */
.site-nav__drawer{
  display:none;
  position:fixed;top:64px;left:0;right:0;z-index:499;
  flex-direction:column;gap:14px;
  background:var(--t-nav-bg);
  padding:18px 28px 24px;
  border-bottom:1px solid var(--t-border-green);
}
.site-nav__drawer.open{display:flex}
.site-nav__drawer a{
  font-size:.85rem;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--t-text-70);
  text-decoration:none;padding:4px 0;
}
.site-nav__drawer a[aria-current="page"]{color:var(--green-l)}
.site-nav__drawer .site-nav__cta{
  padding:10px 18px;text-align:center;font-size:.72rem;
}

/* Landing variant: drawer gets solid background too */
.site-nav--landing + .site-nav__drawer{top:64px}

/* ── Responsive ── */
@media(max-width:820px){
  .site-nav{padding:0 18px}
  .site-nav__links{display:none}
  .site-nav__mobile-cta{display:inline-block}
  .site-nav__hamburger{display:flex}
  .site-nav__right{gap:10px}
}
@media(max-width:420px){
  .site-nav{padding:0 14px}
  .site-nav__right{gap:8px}
}