﻿/* ============================================
   HOME MARKET — Responsive
   ============================================ */

/* ---- Tablet (< 1024px) ---- */
@media (max-width: 1024px) {
  :root { --container-pad: 20px; }

  .nav { display: none; }
  .header-phone { display: none; }
  .header-messengers { display: none; }
  .header-cta .btn { display: none; }
  .burger { display: flex; }

  .hero-stats { gap: 20px; }

  .search-form {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .search-btn { grid-column: 1 / -1; }

  .settlements-grid { grid-template-columns: repeat(2, 1fr); }
  .counters-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; }
  .why-grid { grid-template-columns: repeat(2, 1fr); }
  .latest-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-grid { grid-template-columns: repeat(2, 1fr); }

  .cta-inner { grid-template-columns: 1fr; gap: 48px; }
  .cta-form-wrap { max-width: 560px; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
}

/* ---- Mobile (< 768px) ---- */
@media (max-width: 768px) {
  :root {
    --container-pad: 16px;
    --gap-2xl: 64px;
    --gap-xl: 48px;
    --gap-lg: 28px;
  }

  .section { padding: var(--gap-xl) 0; }

  /* Header */
  .header { padding: 14px 0; }
  .header.scrolled { padding: 10px 0; }
  .logo-badge { display: none; }

  /* Hero */
  .hero-content { padding: 100px 0 60px; }
  .hero-stats { flex-wrap: wrap; gap: 16px; }
  .hero-stat__num { font-size: 28px; }

  .hero-search { padding: 20px; margin-top: 32px; }
  .search-form { grid-template-columns: 1fr; }
  .search-btn { width: 100%; justify-content: center; }

  /* Sections */
  .section-header-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .settlements-grid { grid-template-columns: 1fr; }
  .counters-grid { grid-template-columns: repeat(2, 1fr); gap: 16px 12px; }
  .counter-item::after { display: none; }
  .counter-num { font-size: 28px; margin-bottom: 4px; }
  .counter-label { font-size: 12px; }
  .why-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .why-card { padding: 16px 14px; }
  .why-icon { width: 36px; height: 36px; margin-bottom: 10px; border-radius: 10px; }
  .why-icon svg { width: 18px; height: 18px; }
  .why-num { font-size: 32px; top: 10px; right: 12px; }
  .why-title { font-size: 14px; line-height: 1.25; margin-bottom: 6px; }
  .why-text {
    font-size: 12px;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .latest-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .blog-grid { grid-template-columns: 1fr; }

  .videos-grid .video-card__body { padding: 10px; gap: 3px; }
  .videos-grid .video-card__title { font-size: 12px; line-height: 1.3; }
  .videos-grid .video-card__date { font-size: 10px; }
  .videos-grid .video-play-btn { width: 40px; height: 40px; }
  .videos-grid .video-card__tag,
  .videos-grid .video-card__duration { font-size: 9px; padding: 2px 5px; }

  /* Как на Авито — 2 колонки компактных карточек вместо 1 на весь экран */
  .offers-scroll,
  .latest-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    overflow-x: visible;
    scroll-snap-type: none;
  }
  .offers-scroll .prop-card { flex: none; scroll-snap-align: none; }
  .offers-scroll .prop-card__body,
  .latest-grid .prop-card__body { padding: 12px; gap: 4px; }
  .offers-scroll .prop-card__type,
  .latest-grid .prop-card__type { font-size: 10px; }
  .offers-scroll .prop-card__title,
  .latest-grid .prop-card__title { font-size: 14px; line-height: 1.25; }
  .offers-scroll .prop-card__location,
  .latest-grid .prop-card__location { font-size: 11px; gap: 4px; }
  .offers-scroll .prop-card__location svg,
  .latest-grid .prop-card__location svg { width: 12px; height: 12px; }
  .offers-scroll .prop-card__specs,
  .latest-grid .prop-card__specs { gap: 8px; padding: 8px 0; }
  .offers-scroll .prop-card__spec,
  .latest-grid .prop-card__spec { font-size: 11px; }
  .offers-scroll .prop-card__spec svg,
  .latest-grid .prop-card__spec svg { width: 12px; height: 12px; }
  .offers-scroll .prop-card__price,
  .latest-grid .prop-card__price { font-size: 16px; }
  .offers-scroll .prop-card .btn,
  .latest-grid .prop-card .btn { padding: 6px 10px; font-size: 12px; }
  .offers-scroll .prop-card__badges,
  .latest-grid .prop-card__badges { top: 6px; left: 6px; gap: 4px; }
  .offers-scroll .prop-card__badges .badge,
  .latest-grid .prop-card__badges .badge { font-size: 10px; padding: 3px 6px; }
  .scroll-nav { display: none; } /* стрелки не нужны — теперь сетка, не карусель */

  /* CTA */
  .cta-inner { gap: 32px; }
  .cta-form-wrap { padding: 24px; }

  /* Footer */
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .footer-bottom {
    flex-direction: column;
    text-align: center;
    gap: 8px;
  }
  .footer-bottom-links { justify-content: center; }

  /* Float buttons */
  .float-contacts { right: 16px; bottom: 16px; }
}

/* ---- Small mobile (< 480px) ---- */
@media (max-width: 480px) {
  .hero-title { font-size: 36px; }
  .search-tabs { flex-wrap: wrap; }
  .search-tab { flex: 1; text-align: center; }
  .quiz-options { gap: 8px; }
  .quiz-option { padding: 10px 16px; font-size: 14px; }
  .counters-grid { grid-template-columns: 1fr; }
  .counter-item::after { display: none; }
  .reviews-meta { flex-direction: column; text-align: center; }
}
