/* ==========================================================================
   aanbod-responsive.css · breakpoints for the new Aanbod overview
   Load AFTER aanbod-style.css (same specificity, order decides).
   - Container (bc-wrap): 1436 px from 1600 px up; below 1600 px it gets side space of 5vw (20-80 px),
     so the content width follows the viewport and keeps clear of the screen edge
   - Columns: >= 1200 px 3 | 992-1199 px 2 | 320-991 px 1
   - Filter: 5 columns above 991 px | 2 per row from 991 px down to 320 px
   - Car card: chips and price stay side by side in every viewport (cqw scaling in aanbod-style.css)
   Fluid sizes (clamp / cqw) and the >= 1728 px Figma values stay in aanbod-style.css.
   ========================================================================== */
@media (max-width:1599px){
  .bc-aanbod .bc-wrap{max-width:none;padding:0 clamp(20px,5vw,80px)}
}

@media (max-width:1199px){
  .bc-aanbod .bc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:991px){                                       /* 320-991: one car per row, filter 2 per row */
  .bc-aanbod .bc-grid{grid-template-columns:minmax(0,1fr)}
  .bc-aanbod .bc-filter__row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bc-aanbod .bc-filter__row .bc-btn-dark{grid-column:1/-1}
}

@media (max-width:991px){                                       /* mobile + tablet (1 card per row): more air above the price */
  .bc-aanbod .bc-card__price{margin-top:14px}
}

@media (max-width:575px){
  .bc-aanbod .bc-filter__reset{margin-top:6px}
}
