/* =====================================================
   Mobile Addons — technorazum.ru
   Дополнительные mobile-оптимизации поверх mobile-menu.css
   Все правила внутри @media — PC-версия не ломается
   ===================================================== */

/* === Touch-friendly tap targets (44+ min) === */
@media (max-width: 768px) {
  .btn, button, a.btn--primary, a.btn--ghost {
    min-height: 48px;
    padding: 14px 20px;
    font-size: 16px;
  }

  /* === Hero typography scale (Stripe/Vercel pattern: clamp) === */
  .hero__title    { font-size: clamp(28px, 8vw, 48px) !important; line-height: 1.05; }
  .hero__subtitle { font-size: clamp(15px, 4vw, 18px) !important; }

  /* === Grid → single column stack === */
  .tz-grid, [class*="grid"] { grid-template-columns: 1fr !important; gap: 16px; }
  .tariff-grid, .cases-grid, .avatars-grid { grid-template-columns: 1fr !important; }

  /* === Sections: tighter padding === */
  .section   { padding: 48px 16px !important; }
  .container { padding: 0 16px; }

  /* === Tables → horizontal scroll === */
  table { display: block; overflow-x: auto; white-space: nowrap; }

  /* === Forms: full-width === */
  input, select, textarea, .quiz { max-width: 100%; }

  /* === Hide decorative emblem on mobile (saves perf) === */
  .emblem-orbit { display: none; }

  /* === Mobile nav visibility toggle === */
  .desktop-nav { display: none !important; }
  .mm-burger-btn { display: flex !important; }

  /* === Quiz radio/checkbox larger hit area === */
  input[type="radio"], input[type="checkbox"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
  }
}

/* === Tablet (769–1024px) — partial stack === */
@media (min-width: 769px) and (max-width: 1024px) {
  .tz-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .hero__title { font-size: clamp(36px, 6vw, 56px) !important; }
}

/* === Reduced motion — kill orbit/planet animations === */
@media (prefers-reduced-motion: reduce) {
  .emblem-orbit * { animation: none !important; transition: none !important; }
}

/* === Hide .site-header (mobile menu block) on desktop ===
   На desktop используется существующий <header class="nav"> страницы.
   Mobile-menu-snippet имеет свой <header class="site-header"> — он нужен
   только на мобильных, чтобы не дублировать шапку. */
@media (min-width: 769px) {
  .site-header { display: none !important; }
}

/* === Скрываем существующую PC-навигацию на мобильных ===
   На мобиле её место занимает .site-header из mobile-menu-snippet.
   Чтобы не было двух sticky-headers в стеке, прячем оригинальный nav. */
@media (max-width: 768px) {
  header.nav { display: none !important; }
  nav > header.nav { display: none !important; }
}
