/* py-mobile.css — мобильная вёрстка poweryogarus.ru (цель №2 владельца, 24.09.2026).
   Подключается в header.php ПОСЛЕДНИМ стилем: <link media="(max-width:1125px)" …/py-mobile.css?v=<время файла>>.
   На экранах шире 1125px браузер этот файл НЕ применяет (атрибут media) — и сами правила ниже лежат только
   внутри @media (max-width: 1125px) и уже. Десктоп не меняется (доказательство — notes.md, попиксельно и по стилям).
   Только вёрстка и читаемость: тексты, порядок и содержимое страниц не меняются, ничего не прячется.
   Брейкпоинты — как в app.min.css: 1125 (планшет и телефон), 740 (телефон). */

/* ============ ПЛАНШЕТ И ТЕЛЕФОН (до 1125px) ============ */
@media screen and (max-width: 1125px) {

  /* M-01. Окна регистрации / выбора тарифа / входа: были зажаты в 70% высоты экрана — кнопка «Зарегистрироваться»
     видна только после прокрутки внутри окна. Теперь окно занимает весь экран минус поля 10px. */
  .modal-dialog { max-height: calc(100% - 20px); }

  /* M-02. Поля ввода 13–15px → 16px: iPhone не увеличивает страницу при нажатии в поле. */
  input[type=text], input[type=email], input[type=tel], input[type=password], input[type=search], input[type=number], textarea, select,
  .form__input-text, input[type=text].form__input-text, input[type=email].form__input-text, .form__item textarea,
  .search input, .popup-library__bottom input[type=text], .popup-library__bottom textarea, .popup-library__bottom .form__item textarea {
    font-size: 16px;
  }

  /* M-03. Крестик окна 24×24 → зона нажатия 44×44 (значок прежний). */
  .modal__close { width: 44px; height: 44px; top: 0; right: 0; }

  /* M-04. Подвал 741–1125: отзыв «Выражаю глубокую благодарность…» стоял поверх контактов (ОГРН, адрес).
     Отзыв — отдельной строкой под контактами, без абсолютного позиционирования. */
  .footer-center { flex-wrap: wrap; padding-bottom: 35px; }
  .footer__review { position: static; width: 100%; order: 3; margin-top: 25px; }
  /* M-04b. Цитата в подвале: 12px (на телефоне 10px) → 14px (на ПК 15px). */
  .footer__review_txt { font-size: 14px; }

  /* M-05. Полоса «Скачайте приложение»: текст и кнопки упирались в края экрана. */
  .qrapp { padding-left: 20px; padding-right: 20px; box-sizing: border-box; }
  .qrapp .main-img__txt { padding-right: 20px; }

  /* M-06. Карточки библиотеки: у описания срезалась строка по буквам (фиксированная высота). Та же высота
     в строках, последняя строка — с многоточием. */
  .library-bl-item__txt { height: auto; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
}

/* ============ ТЕЛЕФОН (до 740px) ============ */
@media screen and (max-width: 740px) {

  /* M-07. Шапка: «Попробовать бесплатно» 10px → 12px; бургер 24×21 → невидимая зона нажатия ~44px (значок прежний). */
  header .btn { font-size: 12px; height: 36px; line-height: 34px; padding: 0 10px; }
  .menu-btn { position: relative; }
  .menu-btn::after { content: ""; position: absolute; left: -12px; right: -5px; top: -12px; bottom: -11px; } /* справа не дальше края экрана */

  /* M-08. Окна на телефоне: меньше пустых полей, заголовок 25 → 20px — форма помещается в экран 360×640. */
  .modal__content { padding: 40px 20px 20px; }
  .modal__header { margin-bottom: 20px; padding-right: 24px; }
  .modal__title { font-size: 20px; }
  .modal .form__item { margin-bottom: 18px; }
  .modal .form__note { margin-bottom: 12px; }

  /* M-09. Основной текст 12px → 14px (статья новости, «О Power Yoga», FAQ, «Об основателе», библиотека, тарифы). */
  .content__left { font-size: 14px; }
  .about__text p, .faq__a, .about__left p, .about-benefit-item__txt, .abs__right p, .abs-item__txt,
  .main-img__stxt, .library-top p, .tariffs__left p, .tariffs-bl__item p, .benefit-item__txt { font-size: 14px; }

  /* M-09a. Надписи на больших кнопках 12px → 14px (кнопки те же, высота 47px). */
  .main-img .btn, .reviews-btn, .library-top .btn, .tariffs-bl__item .btn, .about__left .btn, .abs__right .btn,
  .news__left .btn, .btn_back, .account__ttl .btn { font-size: 14px; }

  /* M-10. Анонсы новостей и отзывы: 12px → 14px. Текста видно НЕ МЕНЬШЕ, чем было (замер: символы в видимой части):
     большая новость — анонс целиком, малые — 5 строк, отзывы — до 8 строк; последняя строка — с многоточием. */
  .news__left .news-item__info { font-size: 14px; line-height: 20px; height: auto; max-height: none; display: block; }
  .news__right .news-item__info { font-size: 14px; line-height: 20px; height: auto; max-height: 100px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; }
  .review-item__txt { font-size: 14px; line-height: 20px; height: auto; max-height: 160px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 8; overflow: hidden; }

  /* M-11. Служебный текст 10px → 12px: даты новостей, подпись цитаты в подвале. */
  .news__right .news-item__date, .footer__review_btm { font-size: 12px; }

  /* M-12. Главная: новости и отзывы прижаты к краю экрана (у вложенного блока обнулены отступы). */
  .news-reviews > .inner-page { padding-left: 15px; padding-right: 15px; }
  .news-reviews h2, .news-reviews .h2 { padding-left: 0; padding-right: 0; }

  /* M-13. Карточки библиотеки и «Избранного» — по центру (слева 15px, справа было 22px). */
  .library-bl .section__right .row { margin-left: 0; margin-right: 0; }
  .library-bl .section__right .row .library-bl-item { margin-left: 0; }

  /* M-14. Заголовок главной упирался в правый край экрана. */
  .main-img__left { padding-right: 15px; box-sizing: border-box; }

  /* M-15. Подвал: ссылки «Оплата и возврат», «FAQ», «Политика…» — каждая своей строкой с зоной нажатия; соцсети 35 → 44px. */
  .footer__review_rht > div a { display: block; padding: 6px 0; }
  .footer__review_rht > div p { margin: 0; }
  .footer__soc a { width: 44px; height: 44px; }
}