/* =========================================================
   mpomarket.ru — universal mobile tune (≤640px)
   Goal: improve density, touch targets, iOS feel.
   Does not change visual identity, palette, type scale,
   or composition. Only safer defaults on small screens.
   ========================================================= */
@media (max-width: 640px) {
  /* Tighter side gutters on phone (was 24px → reclaim ~12px content width) */
  .container { padding-left: 18px !important; padding-right: 18px !important; }

  /* Footer bottom row (legal/privacy) — keep links on one line, bump tap area to ≥44px */
  .site-footer__legal-inline a,
  .ftr__bot a {
    padding-top: 10px;
    padding-bottom: 10px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  /* Footer column links — keep them STACKED (each link on its own line),
     just bump tap area to ≥44px. Was inline-flex which collapsed columns. */
  .site-footer__nav a,
  .site-footer__contact-line,
  .ftr__nav a,
  .ftr__col a {
    padding-top: 10px;
    padding-bottom: 10px;
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  /* Mobile burger nav — comfortable tap height */
  .site-header__mobile-nav a {
    padding: 14px 16px;
    min-height: 48px;
    display: flex;
    align-items: center;
  }

  /* iOS feel — kill double-tap zoom flicker and blue tap highlight on every CTA */
  button, .btn,
  a.btn, a.hero__cta, a.hero__cta-secondary,
  .sku-form__btn,
  .site-header__cta,
  .lead-hook__cta,
  .cta-form__form button,
  .cta-form__form input[type="submit"],
  .ftr__cta,
  input[type="submit"], input[type="button"] {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  /* Hero H1 — gentle clamp for 320–414 phones, keeps brand voice */
  .hero__title { font-size: clamp(26px, 7.4vw, 36px); line-height: 1.14; }

  /* Smooth on-page hash scroll without browser jank */
  html { scroll-padding-top: 72px; }
}

/* Extra-narrow phones (iPhone SE / 360px) */
@media (max-width: 380px) {
  .container { padding-left: 14px !important; padding-right: 14px !important; }
}