.site-header {
  position: sticky;
  z-index: 80;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 16px;
  min-height: 76px;
  padding: 12px clamp(18px, 3vw, 46px);
  border-bottom: 1px solid rgba(255,255,255,.075);
  background: rgba(7,9,22,.56);
  box-shadow: 0 14px 40px rgba(0,0,0,.14);
  backdrop-filter: blur(12px) saturate(125%);
  transition: min-height var(--motion-base), background var(--motion-base), backdrop-filter var(--motion-base), box-shadow var(--motion-base);
}
.site-header.is-scrolled { min-height: 66px; background: rgba(7,9,22,.87); box-shadow: 0 16px 48px rgba(0,0,0,.32); backdrop-filter: blur(22px) saturate(140%); }
.brand { min-width: 230px; }
.brand-logo { width: 46px; height: 46px; filter: drop-shadow(0 10px 18px rgba(85,234,219,.18)); }
.brand-copy strong { color: var(--text-main); font-size: 20px; font-weight: 780; letter-spacing: -.035em; }
.brand-copy strong span { color: var(--primary); }
.brand-copy small { color: var(--text-muted); font-size: 10px; letter-spacing: .11em; }
.site-nav { order: initial; width: auto; overflow: visible; gap: clamp(2px, .5vw, 8px); }
.site-nav a { position: relative; border-radius: 0; padding: 12px clamp(8px, 1vw, 14px); color: var(--text-secondary); font-size: 13px; font-weight: 650; background: transparent !important; box-shadow: none !important; }
.site-nav a::after { content: ""; position: absolute; right: 50%; bottom: 3px; left: 50%; height: 1px; background: linear-gradient(90deg, transparent, var(--primary), transparent); box-shadow: 0 0 10px rgba(85,234,219,.8); transition: left var(--motion-base) var(--ease-out), right var(--motion-base) var(--ease-out); }
.site-nav a:hover, .site-nav a.active { color: var(--text-main); }
.site-nav a:hover::after, .site-nav a.active::after { right: 15%; left: 15%; }
.header-tools { display: flex; align-items: center; justify-content: end; gap: 9px; min-width: 310px; }
.auth-slot { display: flex; align-items: center; min-width: 116px; }
.account-link { display: grid; gap: 1px; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; padding: 7px 10px; color: var(--text-secondary); font-size: 10px; text-decoration: none; }
.account-link span { overflow: hidden; max-width: 105px; color: var(--text-main); font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.account-link small { color: var(--text-muted); font-size: 8px; }
.account-menu { position: relative; display: flex; align-items: center; gap: 5px; }
.account-menu > a:not(.account-link), .account-menu > button { border: 0; padding: 7px; color: var(--text-muted); background: transparent; font-size: 9px; text-decoration: none; }
.account-menu > a:hover, .account-menu > button:hover { color: var(--text-main); }
.recent-project { display: flex; align-items: center; gap: 9px; max-width: 138px; margin-right: 3px; color: var(--text-muted); }
.recent-project__dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--success); box-shadow: 0 0 10px rgba(100,230,171,.5); }
.recent-project > span:last-child { display: grid; min-width: 0; }
.recent-project small { font-size: 8px; letter-spacing: .16em; }
.recent-project strong { overflow: hidden; color: var(--text-secondary); font-size: 10px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.header-cta { min-height: 42px; padding-inline: 17px; }
.header-cta i { margin-left: 10px; font-size: 15px; font-style: normal; transition: transform var(--motion-fast); }
.header-cta:hover i { transform: translateX(2px); }
.nav-toggle { display: none; width: 42px; height: 42px; place-content: center; gap: 5px; border-radius: var(--radius-sm); padding: 0; }
.nav-toggle span { display: block; width: 18px; height: 1px; background: currentColor; }