/* Blue Jay — ручной UI-слой bjay.life (bj-ui.css)
   ------------------------------------------------------------------
   ЭТОТ ФАЙЛ НЕ ПЕРЕСОБИРАЕТСЯ генератором gen-static.py — в отличие от
   site.css, который при каждой публикации выкачивается из билда превью.
   Здесь живут стили, которых нет в исходнике приложения:
   мобильное меню (создаёт bj.js) и плавающая кнопка связи (создаёт bj.js v4).
   История: 22.07.2026 пересборка site.css молча стёрла эти правила из живого
   css (они были добавлены руками 05.07) — мобильное меню стало невидимым.
   При правках повышать ?v=N во всех html. Копия в satellite/app/public/assets/. */

/* ---------- мобильное меню ---------- */
@keyframes bjMmIn { from { opacity: 0 } to { opacity: 1 } }

.bj-mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 55; /* под шапкой (у .bj-header z-index 60) — бургер остаётся кликабельным */
  display: none;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 108px 30px 40px;
  background: linear-gradient(180deg, #081221 0%, #0d274f 130%);
  overflow-y: auto;
  animation: bjMmIn .35s ease both;
}
.bj-mobile-menu a {
  font-family: var(--bj-serif, Georgia, serif);
  font-size: 1.65rem;
  line-height: 1.4;
  letter-spacing: .04em;
  color: var(--bj-cream, #f9f6f0);
  text-decoration: none;
  padding: 9px 0;
}
.bj-mobile-menu a:active { color: var(--bj-blue, #648bcd); }
.bj-mobile-menu a.bj-mm-cta {
  margin-top: 26px;
  font-family: var(--bj-sans, 'Roboto Condensed', sans-serif);
  font-size: .85rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--bj-ink, #0d274f);
  background: var(--bj-cream, #f9f6f0);
  padding: 15px 34px;
  border-radius: 999px;
}
body.bj-menu-open { overflow: hidden; }
body.bj-menu-open .bj-header { background: rgba(8, 18, 33, .97); }

/* ---------- плавающая кнопка связи (bj-fab) ---------- */
#bj-fab {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 50;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .45s ease;
}
#bj-fab.bj-fab-show { opacity: 1; pointer-events: auto; }
#bj-fab-btn {
  width: 56px;
  height: 56px;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  background: var(--bj-ink, #0d274f);
  color: var(--bj-cream, #f9f6f0);
  font-size: 22px;
  line-height: 1;
  box-shadow: 0 6px 22px rgba(8, 18, 33, .45);
  display: flex;
  align-items: center;
  justify-content: center;
}
#bj-fab .bj-fab-opts {
  display: none;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}
#bj-fab.open .bj-fab-opts { display: flex; animation: bjMmIn .25s ease both; }
#bj-fab .bj-fab-opts a {
  font-family: var(--bj-sans, 'Roboto Condensed', sans-serif);
  font-size: .82rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--bj-cream, #f9f6f0);
  background: rgba(8, 18, 33, .95);
  border: 1px solid rgba(232, 226, 212, .25);
  border-radius: 999px;
  padding: 11px 18px;
  box-shadow: 0 4px 14px rgba(8, 18, 33, .35);
}