/* ==========================================================================
   Тест «Подберём кофе» — экран «сейчас нечего предложить», телефон.

   Сам блок описан в newdesign/quiz-pick.css. Здесь только то, что на узком
   экране должно быть иначе: кнопка «Весь каталог» во всю ширину — тянуться
   к ней большим пальцем по центру экрана удобнее, чем к узкой слева.

   Размеры в px, а не в --u: на 375px доли макета упираются в минимум
   ≈0,7px, и текст выходил бы 10–11px. То же правило во всех файлах mobile/.
   ========================================================================== */
/* Условие то же, что во всех файлах mobile/: узкий экран ИЛИ телефон,
   повёрнутый набок. Менять только вместе со всем мобильным слоем. */
@media (max-width:767px), (max-width:1023px) and (max-height:520px){
  /* Полная ширина сетки продублирована из newdesign/quiz-pick.css нарочно:
     десктопные файлы перечислены в header.php поимённо, а mobile/ идёт
     глобом, и пока строку с quiz-pick.css туда не добавили, на телефоне
     сетка двухколоночная (mobile/quiz.css:100) и блок сжался бы в колонку
     ≈165px. Дубль на два правила дешевле, чем текст с кнопкой в полколонки. */
  .qr-none{grid-column:1 / -1;gap:14px}
  .qr-none p{max-width:none;font-size:15px;line-height:1.45}
  /* Кнопка «Весь каталог»: базовый .pbtn-green (site.css:2398) считает
     рост и кегль от макета — 52 · --u и 16 · --u, а на 375px --u упирается
     в нижнюю границу .70px (site.css:56), то есть 36,4px и 11,2px: под
     палец мало и читается плохо. Задаём px, как у соседней кнопки «Весь
     каталог» в mobile/products.css:388. --btn-h — та самая переменная, от
     которой считаются и min-height, и колпачки фирменной формы со скосом,
     поэтому пропорции кнопки не едут. */
  .qr-none .pbtn-green{--btn-h:44px;font-size:15px;gap:8px;
    align-self:stretch;justify-content:center}

  /* ---- карточки результата: те же, что в каталоге (16.09.2026) ----
     В #quizGrid теперь стоят .pgrid-cell > .pcard с сервера (см.
     newdesign/quiz-pick.css). Сетка повторяет .pgrid на телефоне
     (mobile/products.css:87): одна колонка, промежуток 16. Перебивает
     .qr-grid{repeat(2, …)} из mobile/quiz.css:102 весом (0,2,0) — там
     две колонки были под старую узкую карточку .qr-card, а карточка
     каталога в 165px превращается в нечитаемую (--cp ≈ 0,5). */
  .qresult .qr-grid{grid-template-columns:minmax(0,1fr);gap:16px}

  /* Широкий портрет 620–767 — обратно две колонки, как .pgrid
     (mobile/products.css:176, там же объяснено, почему: карточка во всю
     ширину 620–767 вдвое крупнее десктопной). Условие по высоте — то же. */
  @media (min-width:620px) and (min-height:521px){
    .qresult .qr-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
  }

  /* Телефон набок — две колонки, как .pgrid в mobile/landscape.css:225. */
  @media (max-width:1023px) and (max-height:520px){
    .qresult .qr-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
  }
}
