/* Адаптив Prizma VS — общий слой поверх инлайновых стилей.
   Селекторы цепляются к существующей разметке, чтобы не переписывать страницы.
   Брейкпоинты: 1279 ноутбук · 1023 планшет · 767 телефон · 479 узкий телефон */

/* Страховка от случайного горизонтального выезда на корневом уровне.
   Причина (сетки) чинится классами r-* ниже; это лишь защита от будущих правок.
   clip не создаёт скролл-контейнер и не мешает sticky/fixed; hidden — фолбэк
   для старых iOS Safari, где он корректно работает именно на html/body. */
html, body { overflow-x: hidden; max-width: 100%; }
@supports (overflow-x: clip) { html, body { overflow-x: clip; } }

/* ---------- ≤1279: ноутбук ---------- */
@media (max-width: 1279px) {
  [style*="max-width: 1280px"] { padding-left: 32px !important; padding-right: 32px !important; }
  nav[style*="padding: 20px 40px"] { padding: 18px 28px !important; }
}

/* ---------- ≤1023: планшет ---------- */
@media (max-width: 1023px) {
  [style*="max-width: 1280px"] { padding-left: 26px !important; padding-right: 26px !important; }

  /* Сетки помечены классами в разметке (r-*), поэтому правки инлайновых
     значений grid-template-columns больше не ломают адаптив. */

  /* двухколоночные и «сайдбар + контент» (280px 1fr) складываются в одну */
  .r-stack { grid-template-columns: 1fr !important; gap: 32px !important; }
  /* трёхколоночные (тарифы) — сначала в две */
  .r-3col { grid-template-columns: repeat(2, 1fr) !important; }
  /* четырёхколоночные (команда, шаги) — в две */
  .r-4col { grid-template-columns: repeat(2, 1fr) !important; }
  /* карточки портфолио на главной: 12-колоночная сетка → две колонки */
  .r-portfolio-12 > * { grid-column: span 6 !important; }

  /* заголовки чуть компактнее */
  h1 { font-size: clamp(34px, 6vw, 46px) !important; }
  h2 { font-size: clamp(26px, 4.6vw, 36px) !important; }

  /* блок «Давайте работать вместе»: статистика переносится */
  [style*="min-height: 560px"] { min-height: 460px !important; }
}

/* ---------- ≤767: телефон ---------- */
@media (max-width: 767px) {
  [style*="max-width: 1280px"] { padding-left: 18px !important; padding-right: 18px !important; }
  [style*="padding: 0 40px 100px"],
  [style*="padding: 32px 40px 100px"],
  [style*="padding: 0 40px 80px"] { padding-bottom: 64px !important; }

  /* герой */
  [style*="padding: 120px 40px 88px"] { padding: 96px 18px 56px !important; min-height: 0 !important; }
  [style*="padding: 72px 40px 56px"] { padding: 40px 18px 32px !important; }

  /* навигация: логотип слева, справа бургер (десктоп-кластер скрыт) */
  nav[style*="padding: 20px 40px"] { padding: 14px 16px !important; gap: 10px !important; }
  .nav-desktop { display: none !important; }
  .nav-burger { display: inline-flex !important; }
  .nav-mobile { display: block !important; }

  /* лента логотипов: подпись сверху */
  section[style*="gap: 40px"][style*="padding: 44px 40px"] {
    flex-direction: column !important; align-items: flex-start !important;
    gap: 18px !important; padding: 28px 18px !important;
  }
  section[style*="padding: 44px 40px"] > p { width: 100% !important; }

  /* команда, тарифы и карточки — в одну колонку */
  .r-3col, .r-4col { grid-template-columns: 1fr !important; }
  .r-portfolio-12 > * { grid-column: span 12 !important; }

  /* пары «заголовок + кнопка» переносятся */
  [style*="justify-content: space-between"][style*="gap: 32px"] { flex-wrap: wrap !important; gap: 20px !important; }

  /* услуги-аккордеон */
  summary[style*="padding: 28px 0"] > span:first-child { font-size: 21px !important; }

  /* статистика 400+/25+/5+ */
  [style*="gap: 56px"][style*="text-align: left"] { flex-wrap: wrap !important; gap: 24px 32px !important; }
  [style*="font-size: 48px"] { font-size: 34px !important; }

  /* CTA-блоки */
  [style*="min-height: 560px"] { min-height: 380px !important; }
  [style*="padding: 48px"] { padding: 28px !important; }
  [style*="padding: 40px"] { padding: 26px !important; }

  /* минимальная зона нажатия */
  a[style*="border-radius: 999px"], button[style*="border-radius: 999px"] { min-height: 44px !important; display: inline-flex !important; align-items: center !important; }

  h1 { font-size: clamp(30px, 8vw, 40px) !important; }
  h2 { font-size: clamp(24px, 6.4vw, 32px) !important; }
  h3 { font-size: clamp(20px, 5.4vw, 26px) !important; }
}

/* ---------- ≤479: узкий телефон ---------- */
@media (max-width: 479px) {
  [style*="max-width: 1280px"] { padding-left: 14px !important; padding-right: 14px !important; }
  [style*="padding: 120px 40px 88px"] { padding: 88px 14px 48px !important; }
  nav[style*="padding: 20px 40px"] { padding: 12px 12px !important; }
  [style*="gap: 56px"][style*="text-align: left"] { gap: 18px 24px !important; }
  [style*="font-size: 48px"] { font-size: 28px !important; }
}

/* ================= Мобильное бургер-меню =================
   По умолчанию (≥768) бургер и панель выключены — десктопный вид не меняется.
   Включаются в блоке ≤767 выше (display на .nav-burger/.nav-mobile). */
.nav-burger { display: none; }
.nav-mobile { display: none; }

/* Кнопка-бургер (зона нажатия 44px) */
.nav-burger {
  align-items: center; justify-content: center;
  width: 44px; height: 44px; margin: -6px -6px -6px 0; padding: 0;
  background: transparent; border: 0; cursor: pointer; color: #F2F1F8;
  -webkit-tap-highlight-color: transparent;
}
.nav-burger-box { position: relative; width: 22px; height: 16px; }
.nav-burger-line {
  position: absolute; left: 0; width: 100%; height: 2px; border-radius: 2px; background: currentColor;
  transition: transform .35s cubic-bezier(0.16,1,0.3,1), opacity .2s ease, top .35s cubic-bezier(0.16,1,0.3,1);
}
.nav-burger-line:nth-child(1) { top: 0; }
.nav-burger-line:nth-child(2) { top: 7px; }
.nav-burger-line:nth-child(3) { top: 14px; }
.nav-burger[aria-expanded="true"] .nav-burger-line:nth-child(1) { top: 7px; transform: rotate(45deg); }
.nav-burger[aria-expanded="true"] .nav-burger-line:nth-child(2) { opacity: 0; }
.nav-burger[aria-expanded="true"] .nav-burger-line:nth-child(3) { top: 7px; transform: rotate(-45deg); }

/* Оверлей + подложка */
.nav-mobile { position: fixed; inset: 0; z-index: 900; visibility: hidden; }
.nav-mobile.open { visibility: visible; }
.nav-mobile-backdrop {
  position: absolute; inset: 0; background: rgba(10,9,17,0.72);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  opacity: 0; transition: opacity .3s ease;
}
.nav-mobile.open .nav-mobile-backdrop { opacity: 1; }

/* Выезжающая панель */
.nav-mobile-sheet {
  position: absolute; top: 0; left: 0; right: 0;
  display: flex; flex-direction: column; gap: 6px; padding: 76px 20px 28px;
  background: #0A0911; border-bottom: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 24px 60px rgba(0,0,0,0.5);
  transform: translateY(-16px); opacity: 0;
  transition: transform .38s cubic-bezier(0.16,1,0.3,1), opacity .28s ease;
}
.nav-mobile.open .nav-mobile-sheet { transform: none; opacity: 1; }

.nav-mobile-close {
  position: absolute; top: 14px; right: 14px;
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; padding: 0; border-radius: 999px; cursor: pointer;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); color: #F2F1F8;
}
.nav-mobile-close:hover { background: rgba(255,255,255,0.10); border-color: rgba(255,255,255,0.25); }

.nav-mobile-links { display: flex; flex-direction: column; }
.nav-mlink {
  display: flex; align-items: center; min-height: 52px; padding: 6px 8px; border-radius: 12px;
  font-family: 'Inter', Helvetica, sans-serif; font-size: 22px; font-weight: 500 !important;
  letter-spacing: -0.03em; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.nav-mlink:last-child { border-bottom: 0; }
.nav-mlink:hover, .nav-mlink:focus-visible { color: #A9B3F0; }

.nav-mobile-lang {
  display: inline-flex; align-self: flex-start; gap: 2px; margin-top: 18px; padding: 5px;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08); border-radius: 999px;
}
.nav-mlang {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 40px; padding: 8px 14px; border-radius: 999px;
  font-size: 14px; color: #B0AEC2; text-decoration: none;
}
.nav-mlang.is-active { background: rgba(255,255,255,0.12); color: #FFFFFF; }
.nav-mlang:not(.is-active):hover { color: #F2F1F8; }

@media (prefers-reduced-motion: reduce) {
  .nav-burger-line, .nav-mobile-backdrop, .nav-mobile-sheet { transition: none !important; }
}