/* Липкая кнопка заявки внизу экрана. Только листинг раздела.

   Зачем: шапка листинга это position: relative, она уезжает вверх с первым
   же экраном. Дальше идут девять экранов проектов и текстов, где нажать
   нечего вовсе: следующая кнопка лежит на 9,4 экрана вниз, а три четверти
   посетителей открывают одну страницу и уходят.

   🔴 На карточке проекта этой полосы НЕТ и не нужно: там шапка липкая
   (position: sticky), кнопка «Узнать цены» видна всё время, вторая
   постоянная кнопка была бы дублем.

   Этажи z-index раздела: карточка лота 60, лайтбокс 100, модалка заявки 900.
   Полоса ниже всех троих намеренно: она не должна лезть поверх них. */

.btcta {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 40;
  display: flex; gap: 9px; align-items: center;
  padding: 10px 14px;
  padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  background: var(--bt-bg, var(--paper, #0B1519));
  border-top: 1px solid var(--bt-line, var(--rule, rgba(128, 128, 128, .22)));
  box-shadow: 0 -12px 28px -12px rgba(0, 0, 0, .45);
  transform: translateY(120%);
  transition: transform .22s ease;
}
.btcta.is-on { transform: none; }
.btcta[hidden] { display: none; }

.btcta__go {
  flex: 1 1 auto; min-width: 0;
  height: 52px; padding: 0 14px;
  border: 0; border-radius: var(--btn-radius, 999px);
  cursor: pointer;
  font: 700 14.5px/1.15 var(--bt-font-display, var(--disp, inherit));
  background: var(--btn-primary-bg, var(--bt-primary, #E8850C));
  color: var(--btn-primary-text, #14161A);
}
.btcta__go:hover { background: var(--btn-primary-hover, #D47A09); }

.btcta__tg {
  flex: 0 0 52px; width: 52px; height: 52px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  color: var(--ink, var(--bt-text, #E8E2D4));
  background: var(--bt-surface-3, rgba(255, 255, 255, .07));
  border: 1px solid var(--bt-line, var(--rule, rgba(128, 128, 128, .28)));
  transition: border-color .2s;
}
.btcta__tg:hover { border-color: var(--btn-primary-bg, #E8850C); }

/* Мышь и клавиатура на десктопе: там полосы нет вовсе, но фокус всё равно
   обязан быть видимым, если она когда-нибудь появится шире. */
.btcta__go:focus-visible, .btcta__tg:focus-visible {
  outline: 2px solid var(--btn-primary-bg, #E8850C);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .btcta { transition: none; }
}

/* Полоса живёт на телефоне. На широком экране кнопка в шапке и так рядом,
   а полоса внизу выглядит как баннер и мешает читать. */
@media (min-width: 861px) {
  .btcta { display: none; }
}
