/* index.css — hero-телефон и главная (раньше inline в scripts) */
/* Hero phone — floating overlay */
.hero-phone-outer{
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(calc(-50% + 90px));
  width:200px;
  opacity:.55;
  pointer-events:none;
  overflow:visible;
}
.hero-phone-float{
  position:relative;
  width:200px;
  aspect-ratio:640/1340;
  /* одна мягкая тень — несколько drop-shadow давали «кант» по bbox PNG */
  filter:drop-shadow(0 18px 36px rgba(0,0,0,.22));
  isolation:isolate;
}
@media(min-width:1024px){
  .hero-phone-outer{
    display:block!important;
    right:-30px;
    width:260px;
    opacity:.96;
    pointer-events:auto;
    z-index:20;
  }
  .hero-phone-float{
    width:260px;
    filter:drop-shadow(0 28px 56px rgba(0,0,0,.26));
  }
}
/* Рамка телефона — статична, экран внутри свайпается */
.hero-phone-bezel{
  position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  pointer-events:none;
}
.hero-phone-screen{
  position:absolute;
  left:7.1875%;top:8.806%;
  width:85.625%;height:82.388%;
  border-radius:14px;
  overflow:hidden;
}
.hero-phone-track{
  display:flex;
  width:100%;height:100%;
}
.hero-phone-slide{
  flex:0 0 100%;
  height:100%;
  background-size:116.79% 121.38%;
  background-position:center;
  background-repeat:no-repeat;
}
/* Декоративное свечение за телефоном */
.phone-glow{
  display:none;
  position:absolute;
  right:-80px;top:50%;
  transform:translateY(-50%);
  width:500px;height:600px;
  border-radius:50%;
  pointer-events:none;
  z-index:1;
}
@media(min-width:1024px){
  .phone-glow{
    display:block;
    background:radial-gradient(ellipse at 55% 50%,
      rgba(57,255,136,.20) 0%,
      rgba(57,255,136,.13) 22%,
      rgba(57,255,136,.07) 40%,
      rgba(57,255,136,.03) 55%,
      rgba(57,255,136,.01) 68%,
      transparent 80%);
  }
  .dark .phone-glow{
    background:radial-gradient(ellipse at 55% 50%,
      rgba(57,255,136,.34) 0%,
      rgba(57,255,136,.24) 16%,
      rgba(57,255,136,.16) 30%,
      rgba(57,255,136,.09) 44%,
      rgba(57,255,136,.05) 56%,
      rgba(57,255,136,.025) 68%,
      rgba(57,255,136,.01) 80%,
      rgba(57,255,136,.003) 90%,
      transparent 100%);
    filter:blur(45px);
  }
}
/* Статус-плашка на мобильном — опустить, чтобы свечение не касалось навбара */
@media(max-width:1023.98px){
  .hero-status-badge{
    margin-top:-18px !important;
    margin-left:0 !important;
    position:relative;
    left:50%;
    transform:translateX(-50%);
  }
}
/* Фирменное свечение на карточках фич — как у кнопок/статусбара */
.hero-feature-card{
  box-shadow: var(--shadow-md), 0 0 8px rgba(57,255,136,.9), 0 0 20px rgba(57,255,136,.5), 0 0 40px rgba(57,255,136,.2);
}
/* Свечение линий-разделителей информационного блока (сверху и снизу) */
.hero-divider-glow{
  box-shadow: 0 0 8px rgba(57,255,136,.9), 0 0 20px rgba(57,255,136,.5), 0 0 40px rgba(57,255,136,.2);
}
/* Нижняя линия — светится только внутрь блока (вверх), вниз обрезаем */
.hero-divider-glow-bottom{
  clip-path: inset(-100px -100px 0px -100px);
}
/* Hero word */
#hero-word{
  transition:opacity .4s ease,transform .4s ease;
  display:inline-block;
  background-clip:text;-webkit-background-clip:text;color:transparent;
}
