/* ==========================================================================
   aanbod-responsive.css · responsive rules of the new Aanbod overview
   = the mockup's responsive CSS (brandcars.css, "Responsive" part), Aanbod rules only, same breakpoints
   (1100 px and 640 px), same selectors, same values. Load AFTER aanbod-style.css.
   Lines marked "addition" and the block at the bottom (fluid sizes below 1728 px, wrap side space, 1 car per row <= 991 px) are NOT in the mockup; they stay last so they win.
   ========================================================================== */
@media (max-width:1100px){
  .bc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:640px){
  .bc-grid{grid-template-columns:minmax(0,1fr)}
  .bc-card__info{height:auto;row-gap:8px}
  .bc-card__title{white-space:normal;line-height:1.2}
  .bc-card__chips{flex-wrap:wrap;grid-column:1/-1}
  .bc-card__price{grid-column:1/-1;grid-row:auto;text-align:left}
}

@media (max-width:991px){
  .bc-filter__row{grid-template-columns:1fr 1fr}   /* moved from 1100 px: 992-1199 px keeps the 5-column filter like 1200 px */
  .bc-filter__row .bc-btn-dark{grid-column:1/-1}
  .inner-banner-sec.aanbodtop{display:none}   /* addition: below 992 px the desktop header is hidden and the mobile header is in the page flow */
}

/* ---- additions (not in the mockup), kept last on purpose ---- */
.bc-filter{padding-top:clamp(24px,2.31vw,40px)}
.bc-filter__box{padding:clamp(16px,2.03vw,35px) clamp(16px,2.03vw,35px) clamp(14px,1.33vw,23px) clamp(16px,1.74vw,30px)}
.bc-select{height:clamp(52px,4.05vw,70px);padding-left:clamp(12px,1.33vw,23px);background-position:right clamp(14px,3.4vw,59px) center;padding-right:calc(clamp(14px,3.4vw,59px) + 18px)}
.bc-btn-dark{height:clamp(52px,4.05vw,70px)}
.bc-grid{gap:clamp(14px,1.16vw,20px);padding:clamp(24px,2.31vw,40px) 0 clamp(40px,4.05vw,70px)}
.bc-card{gap:clamp(8px,.64vw,11px)}
.bc-card__info{padding:clamp(12px,3.86cqw,18px) clamp(10px,calc(6.16cqw - 7.7px),21px);column-gap:clamp(5px,2.15cqw,10px);grid-template-columns:minmax(0,1fr) auto;row-gap:0}
.bc-card__title{font-size:clamp(16px,4.29cqw,20px);white-space:nowrap;line-height:.964}
.bc-card__sub{margin-top:clamp(6px,1.93cqw,9px);font-size:clamp(13px,3cqw,14px)}
.bc-card__chips{gap:clamp(2px,calc(5.3cqw - 14.7px),10px);flex-wrap:nowrap;grid-column:1}
.bc-chip{padding:5px clamp(2px,calc(8.4cqw - 25.1px),14px);font-size:clamp(10px,3.3cqw,12px)}
.bc-card__price{grid-column:2;grid-row:3;text-align:right}
.bc-card__price b{font-size:clamp(12px,3.9cqw,16px)}
.bc-card__price b small{font-size:clamp(10.5px,3.3cqw,12px)}
.bc-card__price span{font-size:clamp(10.5px,3.3cqw,14px)}
@media (max-width:1599px){ .bc-wrap{max-width:none;padding:0 clamp(20px,5vw,80px)} }
@media (max-width:1199px){ .bc-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:991px){
  .bc-grid{grid-template-columns:minmax(0,1fr)}
  .bc-card__price{margin-top:14px}
}