/* Mobile funnel chrome: fixed CTA + layers + flip card + compact prices */

:root {
  --kr-cta-z: 100;
  --kr-avatar-z: 50;
  --kr-nav-h: 56px;
  --kr-book-h: 52px;
}

.kr-fixed-book {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(var(--kr-nav-h) + env(safe-area-inset-bottom, 0px) + 8px);
  z-index: var(--kr-cta-z);
  display: none;
  align-items: center;
  justify-content: center;
  min-height: var(--kr-book-h);
  padding: 14px 18px;
  border-radius: 14px;
  border: 2px solid #FFDE59;
  background: linear-gradient(135deg, #593C90, #5E2177);
  color: #FFDE59;
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-weight: 800;
  text-decoration: none;
  text-align: center;
  box-shadow: 0 8px 24px rgba(89, 60, 144, 0.55);
  animation: krBookPulse 2s ease-in-out infinite;
}

@keyframes krBookPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 222, 89, 0.45); }
  50% { box-shadow: 0 0 0 10px rgba(255, 222, 89, 0); }
}

.tour-hl {
  outline: 2px solid #FFDE59 !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(255, 222, 89, 0.35) !important;
  transition: box-shadow 0.25s ease;
}

/* Flip card — 10 преимуществ */
.reasons-flip-card {
  perspective: 1200px;
  max-width: 360px;
  margin: 0 auto 12px;
  border: none;
  background: transparent;
  overflow: visible;
  min-height: 88px;
  cursor: pointer;
}

.reasons-flip-inner {
  position: relative;
  width: 100%;
  min-height: 88px;
  transform-style: preserve-3d;
  transition: transform 0.65s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.reasons-flip-card.is-flipped .reasons-flip-inner {
  transform: rotateY(180deg);
}

.reasons-flip-face {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  border: 2px solid rgba(89, 60, 144, 0.5);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(89, 60, 144, 0.55), rgba(20, 10, 30, 0.92)),
    url('../images/halls/neon.jpg?v=4') center/cover;
  color: #fff;
  padding: 16px;
}

.reasons-flip-front {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 88px;
}

.reasons-flip-back {
  position: absolute;
  inset: 0;
  transform: rotateY(180deg);
  overflow: auto;
  max-height: 320px;
}

.reasons-flip-back-title {
  margin: 0 0 8px;
  color: #FFDE59;
  font-weight: 800;
  font-size: 15px;
  text-align: center;
}

.reasons-flip-list {
  margin: 0;
  padding: 0 0 0 18px;
  font-size: 13px;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.92);
}

.reasons-flip-list li { margin: 0 0 4px; }

.reasons-flip-link {
  display: block;
  margin-top: 10px;
  text-align: center;
  color: #FFDE59;
  font-weight: 700;
  text-decoration: none;
  position: relative;
  z-index: 100;
}

.halls-slide-indicator {
  margin: 8px 0 0;
  text-align: center;
  color: #FFDE59;
  font-size: 13px;
  font-weight: 700;
  font-family: 'Montserrat', sans-serif;
}

@media (max-width: 768px) {
  html.app-mode .kr-fixed-book {
    display: flex;
  }

  html.app-mode .app-container {
    padding-bottom: 0 !important;
  }

  html.app-mode #section-prices .section-content,
  html.app-mode #section-contacts .section-content,
  html.app-mode #section-booking .section-content {
    padding-bottom: 4px;
  }

  html.app-mode #section-prices .section-content {
    padding-bottom: 0 !important;
  }

  html.app-mode .mobile-bottom-wrap {
    z-index: calc(var(--kr-cta-z) + 5) !important;
  }

  /* Hero avatar only — 150px center-bottom, below buttons */
  html.app-mode #section-hero .alexander-avatar {
    width: 150px;
    height: 150px;
    margin: 0 auto 8px;
    position: relative;
    z-index: 50;
    pointer-events: none;
  }

  html.app-mode #section-hero .alexander-avatar img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  html.app-mode #section-hero .btn-hero-book,
  html.app-mode #section-hero .btn-hero-tour,
  html.app-mode #section-hero .btn-speak {
    position: relative;
    z-index: 100;
  }

  html.app-mode #section-hero .btn-hero-stories {
    display: none !important;
  }

  /* Never show tour dock avatar */
  html.app-mode .alexander-dock-avatar-layer {
    display: none !important;
  }

  /* Compact prices — fit above fixed CTA; no hall-name substrate; pull content up */
  html.app-mode #section-prices .prices-header {
    margin: 0 0 2px !important;
    padding: 0 !important;
    min-height: 0 !important;
    background: none !important;
    background-image: none !important;
    border-radius: 0 !important;
  }

  html.app-mode #section-prices .prices-header::before {
    display: none !important;
  }

  html.app-mode #section-prices .prices-title {
    font-size: 15px !important;
    line-height: 1.2 !important;
    margin: 0 0 2px !important;
  }

  html.app-mode #section-prices .prices-subtitle {
    font-size: 11px !important;
    margin: 0 0 2px !important;
  }

  html.app-mode #section-prices .prices-hall-nav {
    margin: 0 0 2px !important;
  }

  html.app-mode #section-prices .hall-info-bar {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 0 2px !important;
    padding: 0 !important;
    gap: 4px !important;
  }

  html.app-mode #section-prices .price-note-block {
    margin: 0 0 4px !important;
    padding: 0 !important;
  }

  html.app-mode #section-prices .price-note-block p {
    font-size: 11px !important;
    margin: 0 !important;
    line-height: 1.25 !important;
  }

  html.app-mode #section-prices .hourly-prices-grid {
    gap: 6px !important;
    margin: 0 0 6px !important;
  }

  html.app-mode #section-prices .price-card {
    padding: 8px 10px !important;
  }

  html.app-mode #section-prices .price-card-header h4 {
    font-size: 13px !important;
    margin: 0 0 4px !important;
  }

  html.app-mode #section-prices .price-row {
    font-size: 12px !important;
    margin: 2px 0 !important;
  }

  html.app-mode #section-prices .packages-divider {
    margin: 6px 0 !important;
  }

  html.app-mode #section-prices .prices-book-btn,
  html.app-mode #section-prices .btn-book {
    display: none !important;
  }

  html.app-mode #section-contacts .articles-subtitle-only {
    display: none !important;
  }

  html.app-mode #section-contacts .section-content {
    padding-top: 8px !important;
  }
}

.stories-page .kr-fixed-book {
  display: flex;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}

.stories-page .stories-container {
  padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
}

.stories-page--voice-only .talking-avatar,
.stories-page--voice-only .reason-alex {
  display: none !important;
}

.stories-progress-seg,
.stories-progress {
  z-index: 200 !important;
}

.story-controls {
  z-index: 100 !important;
}
