/* === Split Hero: текст слева/справа, картинка по центру === */
.split-hero{
  /* переопределяется из шорткода */
  --split-bg: transparent;
  --split-color: #fff;           /* дефолт: белый текст */

  --split-height: 180vh;         /* длина «дороги» анимации */
  --visual-height: 80vh;         /* видимая высота блока */
  --mt: 0px;                     /* верхний отступ */
  --start: 0vh;                  /* задержка старта */
  --title-top: 32%;
  --title-bot: 70%;
  --speed: 1; /* по умолчанию */

  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  height: var(--visual-height);
  margin-top: var(--mt);
  overflow: hidden;
  background: var(--split-bg);
}

/* «Хвост» для суммарной высоты = split-height. Если задана --tail, используем её напрямую */
.split-hero::after{
  content: "";
  display: block;
  height: var(--tail, calc(var(--split-height) - var(--visual-height)));
}

/* Липкий слой (едет на скролле) */
.split-hero__inner{
  position: sticky;
  top: 0;
  height: 100vh;
}



/* Картинка по центру */
.split-hero__img{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%) scale(0.95);
  max-height: var(--img-max, 80vh);
  width: auto;
  z-index: 2;
  pointer-events: none;
}

/* Заголовки: фиксируем Y, по X двигает JS */
.split-hero__title{
  position: absolute;
  left: 50%;
  transform: translate(-50%,-50%);
  font-size: clamp(40px,10vw,180px);
  font-weight: 800;
  letter-spacing: .02em;
  color: var(--split-color);
  white-space: nowrap;
  z-index: 3;
  will-change: transform, opacity;
  opacity: 0;
}
.split-hero__title.left  { top: var(--title-top); }
.split-hero__title.right { top: var(--title-bot); }

/* Кнопка по центру */
.split-hero .split-hero__btn{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  z-index:5;
  text-decoration:none;
}
/* Внешний вид кнопки под Elementor-стили */
.split-hero .split-hero__btn.elementor-button{
  text-transform: uppercase;
  font-weight: 600;
  font-size: 16px;
  line-height: 1em;
  border-radius: 5px;
  padding: 15px 60px;
  background-color: var(--ast-global-color-1);
  border: 0;
  color:#fff;
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  transition: background-color .3s ease, filter .2s ease;
}
.split-hero .split-hero__btn.elementor-button:hover{
  background-color: var(--ast-global-color-0);
}

/* Меньше анимации — уважение системной настройке */
@media (prefers-reduced-motion: reduce){
  .split-hero__title, .split-hero__img{ transition: none !important; }
}

/* no-motion класс (включает JS на мобилках/при reduce motion) */
.split-hero.no-motion .split-hero__title{
  opacity: 1 !important;
}

/* ===== Мобильные: полностью скрыть блок ===== */
@media (max-width: 767px){
  .split-hero{ display: none !important; }
}