#fav-banners{margin:32px 0}
#fav-banners .favbanners__item{display:block;border-radius:12px;overflow:hidden;position:relative;transition:transform .3s ease,filter .3s ease}
#fav-banners .favbanners__item img{width:100%;height:auto;display:block;object-fit:cover}
#fav-banners .favbanners__item:hover{transform:scale(1.03);filter:brightness(1.1)}

/* HORNÍ ŘADA = tlačítkové dlaždice */
#fav-banners .favbanners__grid--sizes{display:flex;gap:12px;margin-bottom:32px}
#fav-banners .favbanners__grid--sizes .favbanners__item{flex:0 0 auto;width:180px;max-width:25%}
#fav-banners .favbanners__grid--sizes .favbanners__item img{aspect-ratio:1/1}

/* DESKTOP – vycentrovat uprostřed, bez scrollu */
@media (min-width:993px){
  #fav-banners .favbanners__grid--sizes{justify-content:center;overflow:visible;width:fit-content;margin-left:auto;margin-right:auto}
}

/* TABLET/MOBIL – vodorovný scroll pro horní pás */
@media (max-width:992px){
  #fav-banners .favbanners__grid--sizes{overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  #fav-banners .favbanners__grid--sizes .favbanners__item{width:160px;scroll-snap-align:start}
  #fav-banners .favbanners__grid--sizes::-webkit-scrollbar{height:6px}
  #fav-banners .favbanners__grid--sizes::-webkit-scrollbar-thumb{background:#ddd;border-radius:6px}
}
@media (max-width:576px){
  #fav-banners .favbanners__grid--sizes{gap:10px}
  #fav-banners .favbanners__grid--sizes .favbanners__item{width:150px}
}

/* SPODNÍ ŘADA = kategorie */
#fav-banners .favbanners__grid--categories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
#fav-banners .favbanners__grid--categories .favbanners__item img{aspect-ratio:16/9}

/* TABLET – 2 sloupce */
@media (max-width:992px){
  #fav-banners .favbanners__grid--categories{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}

/* MOBIL – taky 2 sloupce (zabere méně místa) */
@media (max-width:576px){
  #fav-banners .favbanners__grid--categories{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px}
}