/* ═══════════════════════════════════════════════════════════════
   SUPER ЧЕБУРЕК — responsive.css
   ВСЕ адаптивные переопределения собраны здесь (десктоп-first).
   Брейкпоинты: 1440 / 1200 / 1024 / 860 / 768 / 560 / 400.
   Правишь мобильную версию — не трогая базу, только этот файл.
   ═══════════════════════════════════════════════════════════════ */

/* ── ≥1440px: очень широкие экраны ── */
@media (min-width: 1441px) {
  :root { --container: 1360px; }
  .hero__visual { height: 640px; }
}

/* ── ≤1200px: компактный десктоп ── */
@media (max-width: 1200px) {
  .menu__grid { grid-template-columns: repeat(3, 1fr); }
  .hero__photo--main { width: 74%; }
  .features { gap: 14px; }
  .nav { gap: 0; }
  .nav__link { padding: 10px 12px; font-size: 14.5px; }
  .nav__phone { margin-left: 6px; padding: 11px 18px; font-size: 13.5px; }
}

/* ── ≤1024px: планшеты ── */
@media (max-width: 1024px) {
  .hero__in { grid-template-columns: 1fr; gap: 44px; }
  .hero { padding-top: calc(var(--header-h) + 40px); }
  .hero__visual {
    height: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    max-width: 640px;
  }
  .hero__photo--main {
    position: relative;
    right: auto; top: auto;
    width: 100%;
    height: clamp(300px, 52vw, 430px);
    rotate: 2deg;
    grid-column: 1;
    grid-row: 1;
  }
  .hero__photo--small {
    position: relative;
    left: auto; bottom: auto;
    width: 100%;
    aspect-ratio: 3 / 4;
    rotate: -3deg;
    grid-column: 2;
    grid-row: 1;
    margin-top: 40px;
  }
  .hero__sticker { width: 100px; height: 100px; font-size: 14px; top: -14px; left: -6px; z-index: 2; }
  .hero__facts { gap: 26px; }
  .hero__facts i { max-width: 130px; }

  .about__grid { grid-template-columns: 1fr; }
  .about__photos { position: static; max-width: 560px; }

  .menu__grid { grid-template-columns: repeat(2, 1fr); }
  .m-card__desc { min-height: 0; }

  .gallery__grid { columns: 2; }

  .contacts__grid { grid-template-columns: 1fr; }
  .contacts__map { min-height: 380px; }
}

/* ── ≤860px: спрятать десктоп-навигацию, показать бургер ── */
@media (max-width: 860px) {
  :root { --header-h: 72px; }
  .nav { display: none; }
  .burger { display: flex; }
  .body-lock, body:has(.mobile-menu.is-open) { overflow: hidden; }

  .reviews__head { flex-direction: column; align-items: flex-start; }
  .reviews__score { width: 100%; justify-content: space-between; }
}

/* ── ≤768px: мобильные ── */
@media (max-width: 768px) {
  body { font-size: 16px; }
  .section { padding: 64px 0; }
  .container { --gutter: 18px; }

  /* Кнопка «наверх» не нужна — есть мобильная панель */
  .to-top { display: none; }

  /* Мобильная панель: позвонить / маршрут / меню */
  .call-bar { display: flex; }
  .footer { padding-bottom: 130px; }
  .lightbox { padding: 12px; }
  .lightbox__nav--prev { left: 10px; }
  .lightbox__nav--next { right: 10px; }
  .lightbox__close { top: 12px; right: 12px; }
  .lightbox__figure img { max-height: 68vh; }
  .lightbox__figure figcaption { flex-direction: column; gap: 2px; }

  .marquee { rotate: 0deg; scale: 1; padding: 14px 0; }
  .marquee__track span { font-size: 13px; }

  .hero { min-height: 100vh; min-height: 100dvh; }
  .hero__visual { max-width: none; }
  .hero__cta { gap: 10px; }
  .hero__cta .btn { flex: 1 1 auto; justify-content: center; }
  .hero__facts { gap: 18px 22px; margin-top: 34px; }
  .hero__facts b { font-size: 22px; }
  .hero__facts i { font-size: 12.5px; max-width: 110px; }
  .hero__scroll { display: none; }

  .features { grid-template-columns: 1fr 1fr; gap: 12px; }
  .feature { padding: 20px 16px; }
  .feature__ico { font-size: 22px; margin-bottom: 10px; }
  .feature h3 { font-size: 15.5px; }
  .feature p { font-size: 13.5px; }

  .gallery__grid { column-gap: 12px; }
  .g-item { margin-bottom: 12px; }
  .g-item figcaption { left: 12px; bottom: 10px; font-size: 13px; }

  .r-card { padding: 24px 20px; }
  .r-card__text { font-size: 14.5px; }
  .reviews__score b { font-size: 44px; }
  .reviews__score .btn { display: none; } /* ссылка «все отзывы» есть в подвале и на Картах */

  .contacts__cards { grid-template-columns: 1fr 1fr; gap: 12px; }
  .c-card { padding: 20px 16px; gap: 8px; }
  .c-card p { font-size: 14.5px; }
  .contacts__map { min-height: 320px; }
  .contacts__cta .btn { flex: 1 1 auto; justify-content: center; }

  .footer__in { flex-direction: column; align-items: flex-start; }
  .footer__contacts { text-align: left; }
}

/* ── ≤560px: узкие мобильные ── */
@media (max-width: 560px) {
  .hero__eyebrow { gap: 8px; }
  .hero__eyebrow .chip { padding: 7px 12px; font-size: 12px; }
  .hero__sub { font-size: 15.5px; }

  .features { grid-template-columns: 1fr; }
  .menu__grid { grid-template-columns: 1fr; }
  .m-card__desc { min-height: 0; }
  .gallery__grid { columns: 1; }
  .g-item img { max-height: 420px; object-fit: cover; }

  .about__photos { grid-template-columns: 1fr 1.5fr; gap: 12px; }
  .about__interior { margin-top: 28px; }
  .about__lead { font-size: 16px; }

  .contacts__cards { grid-template-columns: 1fr; }
  .section-title { font-size: clamp(26px, 8vw, 34px); }
  .section-sub { font-size: 16px; }

  .call-bar__btn { font-size: 13px; padding: 12px 4px; }
}

/* ── ≤400px: очень маленькие экраны ── */
@media (max-width: 400px) {
  .hero__cta .btn--lg { padding: 16px 20px; font-size: 12.5px; }
  .hero__facts { gap: 14px 16px; }
  .hero__facts i { max-width: 100px; }
  .logo__text { font-size: 14.5px; }
  .m-card__price { font-size: 22px; }
}

/* ── Ландшафт на низких телефонах ── */
@media (max-height: 480px) and (orientation: landscape) {
  .hero { min-height: auto; padding-bottom: 40px; }
  .hero__visual { display: none; }
  .call-bar { display: none; }
  .footer { padding-bottom: 40px; }
}

/* ── Тач-устройства: тонкая настройка ховеров ── */
@media (hover: none) and (pointer: coarse) {
  .g-item::after { opacity: .9; }
  .g-item figcaption { transform: none; opacity: 1; }
  .m-card:hover, .feature:hover, .r-card:hover, a.c-card:hover { transform: none; }
  .btn:hover, .btn--solid:hover, .btn--ghost:hover { transform: none; }
  .about__photos figure:hover img { transform: none; }
  :root { -webkit-tap-highlight-color: transparent; }
  * { -webkit-tap-highlight-color: transparent; }
}

/* ── Печать ── */
@media print {
  .header, .call-bar, .to-top, .cursor, .preloader, .progress-bar,
  .hero__visual, .gallery__filters, .reviews__nav, .contacts__map, .hero__scroll { display: none !important; }
  body { background: #fff; color: #111; }
}
