.site-header{padding:22px 0;position:sticky;top:0;background:rgba(246,248,242,.85);backdrop-filter:blur(10px);z-index:50}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}

.logo{display:flex;align-items:center;gap:12px;min-width:0}
.logo__icon{width:52px;height:52px;flex:0 0 auto}
.logo__text{min-width:0}
.logo__text b{display:block;font-weight:800;font-size:22px;line-height:1.1;color:var(--ink)}
.logo__text i{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:2px;font-weight:500}

.nav{display:flex;gap:34px}
.nav a{font-weight:500;font-size:15px;color:var(--ink);transition:.2s color;white-space:nowrap}
.nav a:hover{color:var(--green)}

.btn--header{padding:14px 22px}

.header-cta{display:flex;align-items:center;gap:10px}
.btn-tg-round{
  width:38px;height:38px;border-radius:50%;flex:0 0 auto;
  background:#fff;color:var(--green);border:2px solid var(--green);
  display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 4px 12px rgba(106,191,42,.18);transition:.2s;
}
.btn-tg-round:hover{background:var(--green);color:#fff;transform:translateY(-2px);box-shadow:0 8px 18px rgba(106,191,42,.35)}
.btn-tg-round svg{width:17px;height:17px;margin-left:-2px}

@media (max-width:960px){
  .header-inner{gap:12px}
  .logo{order:1}
  .header-cta{order:2}
  .nav{
    order:3;flex-basis:100%;gap:22px;overflow-x:auto;scrollbar-width:none;
    padding:4px 2px 2px;margin-top:4px;-webkit-overflow-scrolling:touch;
  }
  .nav::-webkit-scrollbar{display:none}
  .nav a{font-size:14px}
  .logo__text b{font-size:18px}
  .logo__icon{width:44px;height:44px}
}
@media (max-width:560px){
  .site-header{padding:10px 0}
  .logo{gap:8px}
  .logo__icon{width:32px;height:32px}
  .logo__text b{font-size:13px}
  .logo__text i{font-size:9px;margin-top:0}
  .btn--header{padding:8px 10px;font-size:11px;gap:5px}
  .btn--header svg{width:12px;height:12px}
  .header-cta{gap:6px}
  .btn-tg-round{width:28px;height:28px;border-width:1.5px}
  .btn-tg-round svg{width:13px;height:13px}
  .nav{gap:12px;margin-top:2px}
  .nav a{font-size:11px;font-weight:600}
}
@media (max-width:400px){
  .logo__text i{display:none}
  .btn--header{padding:7px 9px;font-size:10px}
  .nav{gap:10px}
  .nav a{font-size:10.5px}
}