/*
 * CTA между блоками: морф “круг → кнопка BOOKING” + зелёный LED с волнами.
 *
 * Важно:
 * - Скролл-анимации больше нет: CTA статичный, блик — чисто CSS.
 * - Никаких pinned/sticky сцен, никаких бесконечных RAF-расчётов.
 */

.nata-between-pin{
  /* размер “стыка” между секциями (минус 40% по вертикали) */
  --nata-gap: var(--na-ui-booking-section-gap, clamp(58px, 8.4vh, 106px));

  /* размеры круга и финальной кнопки */
  --nata-orb: var(--na-ui-booking-orb, 44px);
  --nata-pill-w: var(--na-ui-booking-pill-w, clamp(196px, 22vw, 264px));
  --nata-pill-h: var(--na-ui-booking-pill-h, 52px);

  /* материал (smoked glass) — тёмно-серый на токенах */
  --nata-line: transparent;
  --nata-glass-a: var(--na-zone-page-bg-0);
  --nata-glass-b: var(--na-zone-page-bg-0);

  /* тени/блики — на токенах */
  --nata-shadow: var(--na-shadow-6);

  /* LED (визуально отключён ниже, оставлено для совместимости разметки) */
  --nata-led: rgba(94, 255, 0, 0.8);
  --nata-led-glow: rgba(94, 255, 0, 0.4);

  /* прогресс: теперь статично (финальное состояние) */
  --nata-appear: 1;
  --nata-morph: 1;
  --nata-live: 1;

  /* старые анимации выключены */
  --nata-float-name: none;
  --nata-wave-name: none;

  height: var(--nata-gap);
  position: relative;

  /* изоляция от глобальных section-паддингов темы */
  padding: 0 !important;
  margin: 0;
  background: transparent;

  display: flex;
  align-items: center;
  justify-content: center;

  z-index: 20;
  isolation: isolate;
}

/* Обёртки оставляем (разметка уже есть), но делаем нейтрально */
.nata-between-sticky{
  position: relative;
  z-index: 21;
  width: 100%;
  height: 100%;

  display: flex;
  align-items: center;
  justify-content: center;
}

.nata-between-inner{
  position: relative;
  width: 100%;
  height: 100%;

  display: flex;
  align-items: center;
  justify-content: center;
}

.nata-cta{
  position: relative;
  isolation: isolate;

  /* ВАЖНО: размер кнопки управляется токенами (см. nataanimal-design-tokens.css) */
  width: var(--nata-pill-w);
  height: var(--nata-pill-h);
  border-radius: var(--na-radius-pill, 999px);

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: var(--na-ui-booking-inner-gap, 12px);
  padding: 0 var(--na-ui-booking-pad-x, 18px);

  cursor: pointer;
  user-select: none;

  /* <a> без подчёркивания */
  text-decoration: none;

  /* без обводок */
  border: 0;

  /* плоская тёмная кнопка без объёма */
  background: var(--na-zone-page-bg-0);
  box-shadow: none;

  backdrop-filter: none;
  -webkit-backdrop-filter: none;

  /* блик обрезаем по форме */
  overflow: hidden;
}

.nata-cta:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px var(--na-zone-control-ring);
}

/* мягкая внутренняя подсветка (фон) */
.nata-cta::before{
  content: none;
}
/* Taplink-style: ОДНА широкая яркая диагональная полоса (проблеск каждые 4 сек) */
.nata-cta::after{
  content: "";
  position: absolute;
  top: -60%;
  bottom: -60%;
  width: 56%;
  left: 0;
  z-index: 1;

  /* жёсткие края полосы (не “пятно” и не мелкая рябь) */
  background: linear-gradient(
    90deg,
    transparent 0%,
    transparent 28%,
    rgba(255,255,255,.98) 28%,
    rgba(255,255,255,.98) 72%,
    transparent 72%,
    transparent 100%
  );

  transform: translateX(-220%) skewX(-22deg);
  opacity: 0;
  pointer-events: none;

  will-change: transform;
  animation: nataBookingTapBand 4s linear infinite;
}

@keyframes nataBookingTapBand{
  0%   { transform: translateX(-220%) skewX(-22deg); opacity: 0; }
  6%   { opacity: .98; }
  16%  { transform: translateX(260%) skewX(-22deg); opacity: .98; }
  20%  { opacity: 0; }
  100% { transform: translateX(260%) skewX(-22deg); opacity: 0; }
}

.nata-cta:hover{
  box-shadow: none;
}

/* LABEL */
.nata-cta__label{
  position: relative;
  z-index: 2;

  /* Шрифт как у кнопок темы */
  font-family: var(--accent-font);
  font-weight: 400;
  font-size: var(--na-ui-booking-font, 20px);
  letter-spacing: .10em;
  text-transform: uppercase;
  line-height: 1;

  color: rgba(246,252,255,.92);
  white-space: nowrap;
  text-shadow: none;

  opacity: var(--nata-live);
  transform: translateY(calc((1 - var(--nata-live)) * 2px));
}

/* LED — убран */
.nata-cta__led{
  display: none;
}

/* небольшой блик внутри LED (на всякий случай) */
.nata-cta__led::after{
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: var(--na-radius-pill, 999px);
  background: rgba(255,255,255,.20);
  opacity: .55;
  pointer-events: none;
}

/* WAVES — выключены */
.nata-cta__wave{
  display: none;
}

/* reduce motion: всё статично */
@media (prefers-reduced-motion: reduce){
  .nata-between-pin{
    height: var(--nata-gap);
  }

  .nata-cta::after{
    animation: none;
    opacity: 0;
  }
}