/* ============================================================
   MegaNut — RESPONSIVE (общий слой + главная)
   Брейкпоинты ТОЛЬКО два (RESPONSIVE_DECISIONS.md): 1199px и 767px.
   Страничные правила остальных страниц — в их pages/*.css (wave B/C).
   На 1920 макет неприкосновенен; здесь только перекомпоновка ниже 1200.
   Products scroll-pin→swipe управляется классом .is-swipe из catalog-pin.js
   (см. pages/home.css) — не дублируется медиазапросом.
   ============================================================ */

/* ==========================================================================
   ≤1199px — планшеты + часть ноутбуков. Бургер, стек 2-кол. блоков.
   ========================================================================== */
@media (max-width: 1199px) {
  /* ── Шапка → бургер ─────────────────────────────────────── */
  .mn-header .mn-nav,
  .mn-header .mn-lang--header,
  .mn-header .mn-btn-contact {
    display: none;
  }
  .mn-header .mn-burger {
    display: flex;
  }

  /* ── 100vh → 100svh для полноэкранных секций ────────────── */
  @supports (height: 100svh) {
    .mn-hero {
      height: 100svh;
    }
  }

  /* ── Hero главной: поджать паддинги контента ────────────── */
  .mn-hero__content {
    padding: 130px var(--mn-pad-side) 150px;
  }

  /* ── About: 2 кол → 1 кол (фото сверху, текст снизу) ────── */
  .mn-habout {
    padding: var(--mn-sec-pad-v) var(--mn-pad-side);
  }
  .mn-habout__grid {
    grid-template-columns: 1fr;
    gap: clamp(28px, 4vw, 48px);
  }

  /* ── Export: 2 кол → 1 кол; глобус (статичный) по центру ── */
  .mn-export__grid {
    grid-template-columns: 1fr;
    gap: clamp(36px, 5vw, 56px);
  }
  .mn-globe,
  .mn-globe__static {
    max-width: 480px;
    margin: 0 auto;
  }

  /* ── FAQ: 2 кол → 1 кол (стек) ──────────────────────────── */
  .mn-faq__inner {
    grid-template-columns: 1fr;
    gap: clamp(28px, 4vh, 44px);
    padding: clamp(40px, 6vh, 64px) clamp(24px, 5vw, 56px);
  }
  .mn-faq__answer {
    padding-right: 24px;
  }

  /* ── Footer: 4 кол → 2 кол ──────────────────────────────── */
  .mn-footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px;
    padding: 48px clamp(28px, 4.5vw, 68px) 36px;
  }
  .mn-footer__bottom {
    padding: 28px clamp(28px, 4.5vw, 68px) 40px;
  }
}

/* ==========================================================================
   ≤767px — телефоны (база 402). Полный рефлоу в 1 колонку.
   ========================================================================== */
@media (max-width: 767px) {
  /* ── Шапка: меньше паддинг pill ─────────────────────────── */
  .mn-header--sticky {
    padding: 12px 16px 0;
  }
  .mn-header__bar {
    padding: 10px 10px 10px 16px;
  }

  /* ── Hero главной ───────────────────────────────────────── */
  .mn-hero {
    min-height: 480px;
  }
  @supports (height: 100svh) {
    .mn-hero {
      height: 100svh;
    }
  }
  .mn-hero__content {
    padding: 110px 24px 130px;
  }
  .mn-hero__buttons {
    flex-direction: column;
    align-items: stretch;
  }
  .mn-hero__buttons .mn-btn,
  .mn-hero__glass {
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
  }
  .mn-hero__controls {
    right: 24px;
    bottom: 40px;
    left: 24px;
    justify-content: flex-end;
  }
  .mn-hero__thumbs,
  .mn-hero__label {
    display: none;
  }
  .mn-hero__bar {
    width: 48px;
  }

  /* ── Marquee чуть плотнее ───────────────────────────────── */
  .mn-marquee__group {
    gap: 18px;
    padding-right: 18px;
  }

  /* ── About: фото сверху, текст снизу; фото ниже ─────────── */
  .mn-habout__photo {
    min-height: 280px;
  }

  /* ── Production carousel: ниже, текст-блок в нижний оверлей ─ */
  .mn-prodslide {
    height: min(70vh, 500px);
  }
  .mn-prodslide__body {
    left: 20px;
    right: 20px;
    bottom: 20px;
    top: auto;
    width: auto;
    gap: 20px;
  }

  /* ── Export: статы 3 в ряд остаются, глобус уже ─────────── */
  .mn-globe,
  .mn-globe__static {
    max-width: 360px;
  }

  /* ── News главной: 2 кол → 1 кол ────────────────────────── */
  .mn-hnews__grid {
    grid-template-columns: 1fr;
  }
  .mn-hnews__grid .mn-ncard {
    aspect-ratio: 16 / 11;
  }

  /* ── FAQ: радиус меньше, паддинг компактнее ─────────────── */
  .mn-faq {
    padding: var(--mn-sec-pad-v-faq) 16px;
  }
  .mn-faq__inner {
    padding: 40px 20px;
  }
  .mn-faq__answer {
    padding: 0 8px 24px 4px;
  }

  /* ── CTA-форма: пилюля → вертикальный стек ──────────────── */
  .mn-cta__inner {
    padding: var(--mn-sec-pad-v-cta) 20px;
  }
  .mn-cta__form {
    flex-direction: column;
    align-items: stretch;
    border-radius: 20px;
    padding: 16px;
    gap: 10px;
  }
  .mn-cta__input,
  .mn-cta__input[name="contact"] {
    flex: 1 1 auto;
    width: 100%;
    padding: 14px 16px;
    border: 1px solid rgba(239, 239, 239, 0.28);
    border-radius: 12px;
  }
  .mn-cta__divider {
    display: none;
  }
  .mn-cta__submit {
    width: 100%;
    justify-content: center;
    border-radius: 12px;
  }

  /* ── Footer: 2 кол → 1 кол ──────────────────────────────── */
  .mn-footer__grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .mn-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  /* ── Радиус FAQ-блока на самых узких ────────────────────── */
}

@media (max-width: 402px) {
  .mn-faq__block {
    border-radius: 20px;
  }
}