/* ==========================================================================
   CARTOK — Responsive rules (mobile-first overrides for larger screens
   already handled by defaults in style.css being desktop-oriented grids;
   here we scale DOWN for smaller viewports)
   ========================================================================== */

@media (max-width:1080px){
  .grid-cards{grid-template-columns:repeat(3,1fr);}
  .stats-strip{grid-template-columns:repeat(4,1fr);}
  .steps-grid{grid-template-columns:repeat(2,1fr);}
  .testi-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .detail-layout{grid-template-columns:1fr;}
  .sticky-box{position:static;}
  .search-layout{grid-template-columns:220px 1fr;}
  .hero-layout{grid-template-columns:1fr;}
  .hero-visual{height:320px;margin-top:20px;}
  .bento-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,170px);}
  .bento-item.tall{grid-row:span 1;}
}

@media (max-width:900px){
  .nav-links{display:none;}
  .hamburger{display:flex;}
  .searchbox-grid{grid-template-columns:1fr 1fr;}
  .search-layout{grid-template-columns:1fr;}
  .filter-panel{
    position:fixed;top:0;left:0;height:100vh;width:88vw;max-width:340px;z-index:400;
    border-radius:0;transform:translateX(-105%);transition:transform .3s cubic-bezier(.16,1,.3,1);max-height:100vh;
  }
  .filter-panel.open{transform:translateX(0);}
  .filter-panel-head #close-filter-mobile{display:flex !important;}
  .filter-scrim.open{display:block;position:fixed;inset:0;background:var(--overlay);z-index:390;}
  .mobile-filter-btn{display:inline-flex;}
  .dash-sidebar{position:fixed;left:0;top:0;transform:translateX(-100%);box-shadow:var(--shadow-lg);z-index:400;}
  .dash-sidebar.open{transform:translateX(0);}
  .dash-menu-btn{display:flex;}
  .dash-content{padding:18px;}
  .stat-grid{grid-template-columns:1fr 1fr;}
  .dash-topbar{padding:0 16px;}
  .dash-topbar .page-title{font-size:16px;max-width:44vw;}
  .dash-topbar .page-sub{display:none;}
  .dash-topbar .btn-label{display:none;}
  .table-scroll-hint{display:flex;}
}

@media (max-width:760px){
  .grid-cards{grid-template-columns:repeat(2,1fr);}
  .stats-strip{grid-template-columns:1fr 1fr;}
  .steps-grid{grid-template-columns:1fr;}
  .testi-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:26px 16px;}
  .gallery{grid-template-columns:1fr;height:auto;}
  .gallery-main{height:260px;}
  .gallery-side{grid-template-columns:1fr 1fr;grid-template-rows:1fr;height:120px;}
  .pros-cons{grid-template-columns:1fr;}
  .info-grid{grid-template-columns:1fr 1fr;}
  .checkbox-grid{grid-template-columns:1fr 1fr;}
  .photo-preview-grid{grid-template-columns:repeat(3,1fr);}
  .bento-grid{grid-template-columns:1fr;grid-template-rows:none;}
  .bento-item.wide,.bento-item.tall{grid-column:span 1;grid-row:span 1;min-height:150px;}
  .hero-visual{display:none;}
  .mobile-cta-bar{display:flex;}
  .has-mobile-cta{padding-bottom:86px;}
}

@media (max-width:560px){
  .container{padding:0 16px;}
  .section{padding:44px 0;}
  .navbar-inner{height:64px;}
  .nav-actions > .btn, .nav-actions > .user-chip{display:none;}
  .grid-cards{grid-template-columns:1fr 1fr;gap:12px;}
  .results-bar{flex-direction:column;align-items:stretch;}
  .results-bar > div:last-child{width:100%;justify-content:space-between;}
  .sort-pill{padding:8px 11px;font-size:11.5px;}
  .stats-strip{grid-template-columns:1fr 1fr;gap:12px;}
  .stat-grid{grid-template-columns:1fr 1fr;gap:12px;}
  .hero{padding:36px 0 24px;}
  .hero-actions{flex-direction:column;}
  .hero-actions .btn{width:100%;}
  .searchbox{padding:14px;}
  .footer-grid{grid-template-columns:1fr;}
  .auth-card{padding:24px;}
  .dash-content{padding:14px;}
  .dash-topbar{padding:0 16px;}
  .card-title{font-size:14px;}
  .card-price{font-size:15px;}
  .role-select{grid-template-columns:1fr;}
}

@media (max-width:420px){
  .grid-cards{grid-template-columns:1fr;}
  .stats-strip{grid-template-columns:1fr;}
  .stat-grid{grid-template-columns:1fr;}
}