/* ============================================================
   responsive.css — мобильный брейкпоинт
   Десктоп выше = perfect-pixel (замеры из Pencil).
   Мобайл здесь = по правилам «Промпт для Pencil — мобильная верстка».
   ⚠️ Точная пиксель-калибровка под Mobile Header/Footer/Поиск (D8Ddiu/Y0cjNh/NugvJ)
      — отдельный шаг мобильного прохода (В2). Сейчас — корректное поведение.
   ============================================================ */

@media (max-width: 480px) {
  :root { --pad-x: 16px; }

  /* === Шапка (Mobile Header D8Ddiu: 60px, только лого + бургер) === */
  .utility-bar { display: none; }              /* мобильный компонент без утилити-бара */
  .main-nav,
  .header-actions { display: none; }
  .burger { display: inline-flex; }
  .burger .icon { width: 26px; height: 26px; }
  .header-main__inner { height: 60px; }
  .logo__mark { width: 24px; height: 26px; }
  .logo__word { font-size: 19px; }

  /* Мобильное меню (раскрывается бургером) */
  .site-header.is-menu-open .mobile-menu {
    display: flex; flex-direction: column;
    padding: 4px 16px 16px;
  }
  .mobile-menu a { padding: 13px 0; font-size: 16px; font-weight: 500; color: var(--text-primary); border-bottom: 1px solid var(--border); }
  .mobile-menu__actions { display: flex; flex-direction: column; gap: 10px; padding-top: 14px; border-bottom: none; }
  .mobile-menu__actions .btn { width: 100%; }
  .mobile-menu__actions .link-login { text-align: center; padding: 8px; border: none; }

  /* === Поиск (Mobile Поиск NugvJ: вертикальный стек) === */
  .search__row { flex-direction: column; }
  .search__submit { width: 100%; border-radius: 11px; padding: 14px; }
  .search__input { border-radius: 12px; padding: 14px 16px; }

  /* Поля расширенного поиска → одна колонка */
  .fields__row { flex-direction: column; }
  .field--spacer { display: none; }

  /* Кнопки карточки → в стопку, на всю ширину */
  .adv-buttons { flex-direction: column; }
  .adv-buttons .btn { width: 100%; }

  /* === Футер (Mobile Footer Y0cjNh: padding [28,16], gap 22, стопка) === */
  .site-footer__inner { padding-block: 28px; gap: 22px; }
  .footer-cols { flex-direction: column; gap: 22px; }
  .footer-stub { flex-direction: column; gap: 10px; }

  /* Экран 1 — Поиск (предварительно; точная калибровка — мобильный проход) */
  .search-page { padding: 36px var(--pad-x) 48px; }
  .search-page__title { font-size: 26px; }
  .search-page__subtitle { font-size: 15px; }

  /* === Экран 2 — Карточка (mobile-фрейм Y4Hofe) === */
  .card-page__main { padding: 20px var(--pad-x) 40px; }
  .card-cols { flex-direction: column; gap: 20px; }
  .card-left { flex: none; width: 100%; }
  .card-title-row { flex-direction: column; align-items: stretch; gap: 14px; }
  .card-title { flex-direction: column; flex-wrap: nowrap; align-items: flex-start; gap: 2px; line-height: 1.25; }
  .card-title__id { font-size: 24px; font-weight: 800; }
  .card-title__model { font-size: 18px; font-weight: 700; }
  .btn-fav { width: 100%; justify-content: center; padding: 14px 16px; font-size: 15px; font-weight: 600; }
  .buy-card { padding: 20px; }
  .wyg { padding: 20px; }
  .detail-row { flex-direction: column; gap: 3px; padding: 12px 20px; }
  .detail-row__key { flex: none; }
  .details__head { padding: 16px 20px; font-size: 16px; }

  /* === Воронка (mobile-фреймы E6boZ / C2zwt) === */
  /* Оплата 3 */
  .pay-page { padding: 24px var(--pad-x) 40px; gap: 20px; }
  .pay-title { font-size: 26px; }
  .pay-summary { padding: 20px; }
  .pay-summary__price { font-size: 26px; }
  .pay-block { padding: 20px; }
  .pay-methods { flex-direction: column; align-items: flex-start; }
  /* 3Б — Оплата не прошла */
  .status-page--fail { padding: 56px var(--pad-x); }
  .status-page--fail .status-title { font-size: 26px; }
  /* 4 — Файл готов */
  .status-page--ready { padding: 40px var(--pad-x) 48px; }
  .status-page--ready .status-page__col { gap: 24px; }
  .status-page--ready .status-title { font-size: 28px; }
  .fr-account { flex-direction: column; align-items: stretch; padding: 20px; }
  .empty-result__actions { flex-direction: column; }
  /* модалка → bottom-sheet (mobile-фрейм v0VguI) */
  .modal { align-items: stretch; justify-content: flex-end; padding: 0; background: rgba(15,23,42,.9); }
  .modal__box { max-width: none; width: 100%; max-height: 92vh; border-radius: 20px 20px 0 0; padding: 14px 16px 24px; }
  .modal__box::before { content: ""; flex: 0 0 auto; width: 40px; height: 4px; border-radius: 999px; background: var(--border); align-self: center; margin-bottom: 2px; }
  .modal__title { font-size: 20px; }
  .modal__subtitle { font-size: 14px; }
  .modal.is-open .modal__box { animation: sheet-up .22s ease; }
  @keyframes sheet-up { from { transform: translateY(100%); } to { transform: translateY(0); } }
}

@media (max-width: 760px) {
  .svc-grid--2, .svc-grid--3 { grid-template-columns: 1fr; }
  .contact-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .page-head__h1 { font-size: 30px; }
  .content-section__h2 { font-size: 22px; }
  .contact-cards { grid-template-columns: 1fr; }
  /* Услуги — карточки по фрейму mnc1h (padding 18, заголовок 16) */
  .content-page__main { padding-block: 24px 40px; }
  .svc2-card { padding: 18px; gap: 10px; }
  .svc2-card__title { font-size: 16px; }
  .svc2-card__desc { font-size: 14px; line-height: 1.45; }
}

@media (max-width: 760px) {
  .service-body { flex-direction: column; }
  .service-aside { flex: none; width: 100%; }
}
@media (max-width: 480px) {
  .service-h1 { font-size: 26px; }
  .service-h2 { font-size: 20px; }
}

@media (max-width: 760px) {
  .otts-head__h1 { font-size: 28px; }
  .lightbox { padding: 16px; }
  .lightbox__bar { position: absolute; top: 24px; right: 16px; width: auto; max-width: none; z-index: 2; }
}

@media (max-width: 560px) {
  /* === База ОТТС: таблица → карточки (mobile-фрейм z7eTwo) === */
  .otts-head__h1 { font-size: 30px; font-weight: 800; }
  .res-table-wrap { overflow: visible; }
  .res-table { min-width: 0; border: none; border-radius: 0; overflow: visible; }
  .res-row--head { display: none; }
  .res-body { display: flex; flex-direction: column; gap: 12px; }
  .res-body .res-row,
  .res-body .res-row:nth-child(odd),
  .res-body .res-row:nth-child(even) {
    display: flex; flex-direction: column; gap: 10px;
    background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 16px;
  }
  .res-row .col-num { flex: none; width: auto; flex-direction: row; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
  .res-num__link { font-size: 15px; }
  .res-premium { align-self: center; }
  .res-row .col-marka,
  .res-row .col-model,
  .res-row .col-cat,
  .res-row .col-eco {
    flex: none; width: auto; display: flex; gap: 10px; align-items: baseline;
  }
  .res-row .col-marka::before,
  .res-row .col-model::before,
  .res-row .col-cat::before,
  .res-row .col-eco::before {
    flex: 0 0 96px; color: var(--text-secondary); font-size: 13px; font-weight: 500;
  }
  .res-row .col-marka::before { content: "Марка"; }
  .res-row .col-model::before { content: "Модель"; }
  .res-row .col-cat::before { content: "Категория"; }
  .res-row .col-eco::before { content: "Экокласс"; }
  .res-cell, .res-cell--eco { font-size: 14px; font-weight: 500; color: var(--text-primary); }
  /* категория без пилюли на мобайле */
  .res-row .col-cat .res-cat-pill { background: none; padding: 0; font-size: 14px; font-weight: 500; }
  /* пагинация компактнее */
  .res-page, .res-page--num { width: 38px; height: 38px; }
}

@media (max-width: 980px) { .tools-row { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .tools-row { grid-template-columns: 1fr; } .tools-head__h1 { font-size: 30px; } }

@media (max-width: 560px) {
  .calc-fields__row { flex-direction: column; }
  .calc-head__h1 { font-size: 26px; }
}

@media (max-width: 900px) {
  .contract-content { flex-direction: column; }
  .contract-form { flex: none; width: 100%; }
  .contract-preview { width: 100%; padding: 24px; }
  .doc-veh__key { flex-basis: 180px; width: 180px; }
}

@media (max-width: 560px) {
  .auth-head__title { font-size: 30px; }
  .auth-head__sub { font-size: 16px; }
  .auth-card { padding: 24px; }
  .auth-page { padding: 48px var(--pad-x) 56px; }
}

@media (max-width: 760px) {
  .lk-body { flex-direction: column; }
  .lk-sidebar { flex: none; width: 100%; border-right: none; border-bottom: 1px solid var(--border); }
  .lk-content { padding: 24px 16px; }
  .fav-row { flex-wrap: wrap; }
  .fav-row__right { width: 100%; }
  .fav-action { flex: 1; justify-content: center; }
  .fav-empty { padding: 32px 20px; }
}

@media (max-width: 480px) {
  /* === Поиск / 1Б — пиксель-калибровка (cE3mK / wpDIL) === */
  .search-page { padding: 28px 16px 48px; }
  .search-page__content { gap: 20px; }
  .search-page__hero { gap: 8px; }
  .search-page__title { font-size: 26px; font-weight: 700; }
  .search-page__subtitle { font-size: 15px; line-height: 1.4; }

  .empty-result { padding: 32px; gap: 14px; }
  .empty-result__icon { width: 64px; height: 64px; }
  .empty-result__icon .icon { width: 28px; height: 28px; }
  .ei-glyph--desktop { display: none; }
  .ei-glyph--mobile { display: block; }
  .empty-result__texts { gap: 12px; }
  .empty-result__title { font-size: 20px; }
  .empty-result__text { font-size: 14px; line-height: 1.5; }
  .empty-result__actions { flex-direction: column; width: 100%; gap: 10px; padding-top: 0; }
  .empty-result .btn-outline { border-radius: 10px; padding: 13px; width: 100%; }
  .link-quiet { font-size: 14px; }
}

@media (max-width: 760px) {
  /* ЛК: сайдбар → пилюли-табы (mobile-фреймы) */
  .lk-sidebar { display: none; }
  .lk-tabs { display: flex; }
  .lk-logout-m { display: inline-flex; }
  .lk-content { padding: 16px; gap: 16px; }
  .lk-h1 { font-size: 22px; }
  /* Избранное: строки → карточки */
  .fav-row { flex-wrap: wrap; align-items: center; gap: 14px; }
  .fav-row__left { flex: 1 1 auto; }
  .fav-row__mid { margin-left: 0; order: 2; }
  .fav-row__right { order: 3; flex-basis: 100%; }
  .fav-action { flex: 1; }
  .fav-remove { width: 44px; height: 44px; }
}