/* =========================================================================
   SoftPortal — responsive.css
   Контрольные точки: 1200 / 992 / 768 / 576 px
   ========================================================================= */

/* ----- large desktops down to 1200px ----- */
@media (max-width: 1200px) {
  :root { --gap: 20px; }
  .editor-grid { grid-template-columns: repeat(3, 1fr); }
  .compact-grid { grid-template-columns: repeat(4, 1fr); }
  .cat-grid { grid-template-columns: repeat(4, 1fr); }
  .hero__title { font-size: 40px; }
  .layout { grid-template-columns: minmax(0,1fr) 300px; gap: 26px; }
  .site-footer__top { grid-template-columns: 1.4fr 1fr 1fr 1.6fr; }
  .site-footer__top .footer-col--cats { display: none; }
}

/* ----- tablets / small laptops ----- */
@media (max-width: 992px) {
  h1 { font-size: 30px; }
  .main-nav, .header-search { display: none; }
  .burger { display: inline-flex; }
  .header-actions .btn-app { display: none; }
  .header-search { margin-left: auto; }

  .hero { padding: 36px 0 24px; }
  .hero__grid { grid-template-columns: 1fr; gap: 28px; }
  .hero__media { order: -1; max-width: 440px; margin: 0 auto; }
  .hero__title { font-size: 36px; }

  .editor-grid { grid-template-columns: repeat(2, 1fr); }
  .news-grid { grid-template-columns: repeat(2, 1fr); }
  .compact-grid { grid-template-columns: repeat(3, 1fr); }
  .cat-grid { grid-template-columns: repeat(3, 1fr); }

  /* sidebar drops below content */
  .layout, .layout--reverse { grid-template-columns: 1fr; }
  .layout__aside { position: static; order: 2; grid-template-columns: repeat(2, 1fr); display: grid; }
  .layout__aside .widget { height: 100%; }
  .layout__main { order: 1; }

  .cat-hero__grid { grid-template-columns: 1fr; }
  .cat-hero__media { display: none; }

  /* category filters become a slide-in panel */
  .filters-toggle { display: inline-flex; }
  .filters-sidebar {
    position: fixed; top: 0; right: 0; bottom: 0; z-index: var(--z-mobile);
    width: min(88vw, 360px); background: #fff; box-shadow: var(--shadow-pop);
    transform: translateX(100%); transition: transform .25s ease;
    overflow-y: auto; padding: 16px;
  }
  .filters-sidebar.is-open { transform: translateX(0); }
  .filters-sidebar__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
  .filters-overlay { position: fixed; inset: 0; background: rgba(16,24,40,.45); z-index: calc(var(--z-mobile) - 1); opacity: 0; visibility: hidden; transition: opacity var(--transition); }
  .filters-overlay.is-open { opacity: 1; visibility: visible; }

  .spec-grid { grid-template-columns: 1fr; }
  .article-pros-cons { grid-template-columns: 1fr; }

  .site-footer__top { grid-template-columns: 1fr 1fr; gap: 28px; }
  .site-footer__brand { grid-column: 1 / -1; }
  .site-footer__top .footer-col--cats { display: block; }
}

/* ----- phones ----- */
@media (max-width: 768px) {
  body { font-size: 14.5px; }
  .section { padding: 28px 0; }
  .container { padding: 0 16px; }

  .hero__title { font-size: 30px; }
  .hero__desc { font-size: 16px; }
  .hero__actions .btn { flex: 1 1 auto; }

  .editor-grid { grid-template-columns: 1fr; }
  .news-grid { grid-template-columns: 1fr; }
  .compact-grid { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
  .compact-grid .compact-card { flex: 0 0 200px; scroll-snap-align: start; }
  .cat-grid { grid-template-columns: repeat(2, 1fr); }

  .section-head { flex-wrap: wrap; }
  .section-head__title { font-size: 21px; }

  .layout__aside { grid-template-columns: 1fr; }

  .article { padding: 20px; border-radius: var(--radius-medium); }
  .article__title { font-size: 25px; }
  .article__meta { gap: 12px; font-size: 13px; }

  .download-box { padding: 18px; }
  .download-box__action { width: 100%; }
  .download-box__action .btn { width: 100%; }

  /* horizontally scrollable chips */
  .filter-chips { flex-wrap: nowrap; overflow-x: auto; padding: 16px 0; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
  .filter-chips .chip { flex: 0 0 auto; scroll-snap-align: start; }

  .list-card { flex-direction: column; }
  .list-card__media { width: 64px; height: 64px; }
  .list-card__head { flex-direction: column; }
  .list-card__meta { margin-left: 0; }

  .subcat-grid { grid-template-columns: repeat(2, 1fr); }

  .comment .comment { margin-left: 14px; }

  .subscribe-form { flex-direction: column; }
  .subscribe-form .btn { width: 100%; }

  .site-footer__top { grid-template-columns: 1fr; gap: 24px; padding: 36px 0; }
  .site-footer__bottom { flex-direction: column; align-items: flex-start; }

  .error-404__num { font-size: 92px; }
}

/* ----- small phones ----- */
@media (max-width: 576px) {
  .cat-grid { grid-template-columns: 1fr 1fr; }
  .form-group.combo { grid-template-columns: 1fr; }
  .modal__dialog { margin-top: 0; min-height: 100%; border-radius: 0; width: 100vw; }
  .auth-card { padding: 24px 18px; }
  .hero__title { font-size: 27px; }
  .section-head__link { font-size: 13px; }
  .to-top { right: 14px; bottom: 14px; width: 44px; height: 44px; }
  .next-prev .btn { width: 100%; }
  .article-gallery { grid-template-columns: 1fr 1fr; }
}

/* ----- very small phones (360px) ----- */
@media (max-width: 380px) {
  .cat-grid { grid-template-columns: 1fr; }
  .compact-grid .compact-card { flex-basis: 170px; }
}