/*
 * V39_MAIN_MOBILE_PERFORMANCE_V1
 * Облегчённый режим главной страницы для мобильников,
 * планшетов, prefers-reduced-motion и слабых устройств.
 */

html {
  scroll-behavior: smooth;
}

img {
  max-width: 100%;
  height: auto;
}

/*
 * Блоки ниже первого экрана не требуют полной отрисовки,
 * пока пользователь до них не прокрутил.
 */
@supports (content-visibility: auto) {
  main > section,
  body > section,
  .section {
    content-visibility: auto;
    contain-intrinsic-size: 1px 760px;
  }

  .hero,
  #hero,
  header,
  nav {
    content-visibility: visible;
    contain-intrinsic-size: auto;
  }
}

/*
 * Автоматический lite-режим:
 * - мобильники и планшеты;
 * - prefers-reduced-motion;
 * - устройства, которые JS определил как слабые.
 */
@media (max-width: 1024px),
       (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
  }

  /*
   * Отключаем наиболее тяжёлые бесконечные эффекты.
   * Переходы кнопок остаются, но становятся короткими.
   */
  .v10-particles,
  .hero-particles,
  #heroParticles,
  #aiNetwork,
  .ai-network,
  .network-canvas,
  canvas[data-particles],
  canvas.particles,
  .mouse-glow,
  .real-glow,
  .liquid-gradient,
  .v10-liquid,
  .v10-logo-particles {
    display: none !important;
  }

  .v10-marquee-track,
  .demo-carousel-track,
  .trust-strip-track,
  .v22-demo-track,
  .v27-orbit,
  .v27-node,
  .hero-floating-badge,
  .floating-badge {
    animation: none !important;
    transform: none !important;
  }

  .card,
  .v10-bento-card,
  .v10-story-card,
  .price-mini,
  .pricing-card,
  .case-card,
  .why-card,
  .small-business-card {
    transform: none !important;
    transition-duration: 0.15s !important;
  }

  /*
   * Blur и backdrop-filter сильно нагружают GPU
   * на дешёвых Android и старых планшетах.
   */
  .card,
  .panel,
  .pricing-card,
  .price-mini,
  .v10-bento-card,
  .v10-story-card,
  .v27-node,
  header,
  nav {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /*
   * Уменьшаем сложные тени и свечения.
   */
  .card,
  .pricing-card,
  .price-mini,
  .btn,
  .v10-bento-card,
  .v10-story-card {
    box-shadow:
      0 8px 24px rgba(0, 0, 0, 0.22) !important;
  }

  /*
   * Горизонтальные тарифы остаются удобными,
   * но не запускают тяжёлые hover-анимации.
   */
  .price-row {
    scroll-snap-type: x proximity !important;
  }

  .price-mini:hover,
  .card:hover {
    transform: none !important;
  }

  /*
   * Фиксированная кнопка не перекрывает контент.
   */
  body {
    padding-bottom: 82px;
  }

  #stickyCta {
    left: 8px !important;
    right: 8px !important;
    bottom: 8px !important;
  }

  #stickyCta a {
    padding: 13px 16px !important;
    box-shadow:
      0 6px 20px rgba(0, 122, 255, 0.32) !important;
  }
}

/*
 * Более строгий режим для явно слабого устройства.
 */
html.visib-lite-device *,
html.visib-lite-device *::before,
html.visib-lite-device *::after {
  animation-duration: 0.001ms !important;
  animation-iteration-count: 1 !important;
}

html.visib-lite-device .v10-particles,
html.visib-lite-device .hero-particles,
html.visib-lite-device #heroParticles,
html.visib-lite-device #aiNetwork,
html.visib-lite-device .ai-network,
html.visib-lite-device canvas,
html.visib-lite-device .mouse-glow,
html.visib-lite-device .real-glow,
html.visib-lite-device .liquid-gradient {
  display: none !important;
}

html.visib-lite-device .card,
html.visib-lite-device .panel,
html.visib-lite-device .pricing-card,
html.visib-lite-device .price-mini,
html.visib-lite-device header,
html.visib-lite-device nav {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* V39_MAIN_PRICE_MOBILE_LAYOUT_V2 */

/* Ссылка с прайса на главную */
.v39-price-home-link-wrap {
  width: min(1180px, calc(100% - 24px));
  margin: 14px auto 0;
  text-align: left;
}

.v39-price-home-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 16px;
  border-radius: 12px;
  color: #fff;
  text-decoration: none;
  font-weight: 800;
  background: rgba(108, 99, 255, 0.16);
  border: 1px solid rgba(108, 99, 255, 0.35);
}

/* Hero — тарифная кнопка строго по центру */
.v39-hero-tariff-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
  text-align: center;
}

.v39-hero-tariff-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  text-align: center !important;
  margin: 0 !important;
}

/* Нижняя фиксированная кнопка */
#stickyCta {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  transform: none !important;
}

#stickyCta a {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  text-align: center !important;
  white-space: normal !important;
}

/* Центрирование возможностей ViSiB на мобильных */
@media (max-width: 1024px) {
  .v10-bento-grid {
    align-items: stretch !important;
  }

  .v10-bento-card,
  .v10-bento-card.big,
  .v10-bento-card.wide {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
  }

  .v10-bento-icon {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .v10-bento-card h3,
  .v10-bento-card p {
    width: 100%;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

@media (max-width: 700px) {
  .v39-hero-tariff-actions {
    flex-direction: column;
    align-items: center;
  }

  .v39-hero-tariff-btn,
  .v39-client-hero-link {
    width: min(100%, 320px) !important;
    box-sizing: border-box;
    justify-content: center;
    text-align: center !important;
    margin: 0 auto !important;
  }

  #stickyCta {
    left: 10px !important;
    right: 10px !important;
    bottom: 10px !important;
    width: calc(100vw - 20px) !important;
  }

  #stickyCta a {
    min-height: 48px;
    display: flex !important;
    align-items: center;
    justify-content: center;
  }

  .v39-price-home-link-wrap {
    width: calc(100% - 20px);
    text-align: center;
  }

  .v39-price-home-link {
    width: 100%;
    box-sizing: border-box;
  }
}

/* V39_STICKY_CTA_DESKTOP_MOBILE_FIX_V1 */

/*
 * Desktop:
 * возвращаем широкую центральную кнопку.
 */
@media (min-width: 1025px) {
  #stickyCta {
    position: fixed !important;
    left: 50% !important;
    right: auto !important;
    bottom: 18px !important;

    width: min(760px, calc(100vw - 80px)) !important;
    max-width: 760px !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: translateX(-50%) !important;
    box-sizing: border-box !important;

    z-index: 999 !important;
  }

  #stickyCta a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 56px !important;

    margin: 0 !important;
    padding: 15px 28px !important;

    box-sizing: border-box !important;
    text-align: center !important;
    font-size: 17px !important;
    line-height: 1.2 !important;
    white-space: normal !important;

    border-radius: 16px !important;
  }
}

/*
 * Tablet:
 * почти на всю ширину, но с аккуратными полями.
 */
@media (min-width: 701px) and (max-width: 1024px) {
  #stickyCta {
    position: fixed !important;
    left: 18px !important;
    right: 18px !important;
    bottom: 12px !important;

    width: auto !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;
    box-sizing: border-box !important;
  }

  #stickyCta a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 52px !important;

    margin: 0 !important;
    padding: 14px 20px !important;

    box-sizing: border-box !important;
    text-align: center !important;
    font-size: 16px !important;

    border-radius: 15px !important;
  }
}

/*
 * Mobile:
 * полностью видимая компактная кнопка.
 */
@media (max-width: 700px) {
  #stickyCta {
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    bottom: 10px !important;

    width: auto !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;
    box-sizing: border-box !important;
  }

  #stickyCta a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 48px !important;

    margin: 0 !important;
    padding: 12px 16px !important;

    box-sizing: border-box !important;
    text-align: center !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    white-space: normal !important;

    border-radius: 14px !important;
  }
}