/* _buttons-extracted.css
 * Изолированные кнопки .btn-primary и .btn-ghost-dark из base.css.
 * Подключаем отдельно, чтобы НЕ тащить html/body-правила из base.css
 * (которые ломают шрифт всего сайта на этой стадии).
 * Используется hero-блоком — единственная primary CTA «Показать на карте». */

.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  border-radius: 12px;
  background: var(--accent);
  color: var(--accent-ink);
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  box-shadow: 0 6px 18px -6px rgba(245, 180, 0, 0.55);
  transition: transform .18s ease, box-shadow .18s ease, background .15s ease;
  white-space: nowrap;
  border: 0;
  cursor: pointer;
  text-decoration: none;
}
.btn-primary:hover  { transform: translateY(-1px); box-shadow: 0 10px 24px -8px rgba(245, 180, 0, 0.65); background: #ffc935; color: var(--accent-ink); text-decoration: none; }
.btn-primary:active { transform: translateY(0);    box-shadow: 0 3px 10px -4px rgba(245, 180, 0, 0.55); }
.btn-primary:disabled,
.btn-primary[disabled] { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }

.btn-ghost-dark {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  border-radius: 12px;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.16);
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
  transition: background-color .15s ease;
}
.btn-ghost-dark:hover { background: rgba(255, 255, 255, 0.10); color: #ffffff; text-decoration: none; }