/* ====== UI Components ====== */

/* Кнопки */
/* Кнопки */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 16px; border-radius:12px; font-weight:700;
  border:1px solid transparent; cursor:pointer; transition:.2s ease;
  white-space:nowrap;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, "Helvetica Neue", Arial, sans-serif; /* фикс */
  letter-spacing:.2px;
}
.btn--accent{
  background: linear-gradient(135deg, var(--accent), var(--accent-600));
  color:#131313; box-shadow: var(--shadow-2);
}
.btn--accent:hover{ filter:brightness(.95); }
.btn--ghost{
  background: rgba(255,255,255,.03);
  border-color: rgba(255,255,255,.06);
  color: var(--text);
}
.btn--ghost:hover{ background: rgba(255,255,255,.06); }

/* Бейдж (оставляем обычный Inter, как у кнопки) */
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family: "Inter", system-ui, sans-serif;
  font-weight:700; letter-spacing:.6px; text-transform:uppercase; font-size:12px;
  color:#0f1115; background: var(--accent);
  padding:6px 10px; border-radius:999px; width:max-content;
  box-shadow: var(--shadow-2);
}

/* Бургер */
.nav__menu-btn{
  width:42px; height:42px; border-radius:10px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  color: var(--text);
  transition: background .2s ease, transform .2s ease;
}
.nav__menu-btn:hover{ background: rgba(255,255,255,.07); transform: translateY(-1px); }
.burger,
.burger::before,
.burger::after{
  content:""; display:block; width:18px; height:2px; border-radius:2px;
  background: var(--text);
}
.burger{ position:relative; }
.burger::before{ position:absolute; left:0; top:-6px; }
.burger::after{ position:absolute; left:0; top:6px; }

/* Карточки (если понадобится) */
.feature{
  padding:20px; border-radius: var(--radius-lg);
  border:1px solid var(--line); background: rgba(255,255,255,.02);
  transition: .25s ease transform, .25s ease background;
}
.feature:hover{ transform: translateY(-3px); background: rgba(255,255,255,.035); }
.feature__icon{
  width:42px; height:42px; border-radius:12px;
  display:grid; place-items:center; margin-bottom:12px;
  background: linear-gradient(135deg, rgba(242,193,78,.18), rgba(242,193,78,.04));
  border: 1px solid rgba(242,193,78,.35);
}