/* ===== Кнопки перехода: <button> вместо <a> ===== */
button.btn {
  padding: 0;
  font-family: inherit;
}
button.btn.secondary {
  background: transparent;
}
.out-link {
  cursor: pointer;
}
.out-link:hover {
  text-decoration: underline;
}

/* ===== Хлебные крошки отдельной полосой под header ===== */
/* hero заходит под полосу на высоту header, чтобы его фон шёл без шва,
   и рисуется поверх (персонажи не обрезаются); клики по его прозрачному
   верхнему отступу проходят к хлебным крошкам */
.breadcrumbs-bar {
  position: relative;
  padding-top: 96px;
  background: var(--black);
}
.breadcrumbs-bar + #hero {
  margin-top: -96px;
  pointer-events: none;
}
.breadcrumbs-bar + #hero > * {
  pointer-events: auto;
}
/* у header уже есть ~38px пустого места под пунктами меню,
   поэтому сверху у крошек отступа нет.
   В custom.css много правил под конкретные шаблоны (margin-bottom до 150px,
   центрирование, padding), рассчитанных на крошки внутри hero; в полосе они
   не нужны — гасим их более специфичным селектором с !important. */
.breadcrumbs-bar .container-lg .breadcrumbs,
.breadcrumbs-bar .container-lg .breadcrumbs.hidden-xs {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: flex-start !important;
  margin: 0 !important;
  padding: 0 0 64px !important;
}
@media (max-width: 1040px) {
  .breadcrumbs-bar {
    padding-top: 56px;
  }
  .breadcrumbs-bar .container-lg .breadcrumbs,
  .breadcrumbs-bar .container-lg .breadcrumbs.hidden-xs {
    padding: 10px 0 20px !important;
  }
  .breadcrumbs-bar + #hero {
    margin-top: -56px;
  }
}

/* ===== Кнопка Play в hero ===== */
#hero .container-lg .btn.hero-play-btn {
  margin: 20px 0;
  align-self: center;
}
/* страница слота: кнопка между заголовком и картинкой игры;
   у кнопок в .left тема задаёт абсолютное позиционирование и нулевые отступы */
#hero .slots-info .left .btn.hero-play-btn {
  position: static;
  transform: none;
  margin: 12px 0 20px !important;
}

/* ===== 404 и Sitemap: hero подстраивается под кнопку Play ===== */
#hero.hero-sitemap {
  height: auto;
  min-height: 420px;
  padding-bottom: 110px;
}
#hero.hero-sitemap::after {
  height: 100%;
}

/* ===== Список казино (/online-casinos): не налезать на изгиб hero ===== */
#online-casinos {
  padding-top: 120px;
}