/* ============================================================
   Category tiles widget — "Sắm cả bộ"
   ============================================================ */

.hs-cats__grid{
  display:grid;
  grid-template-columns:repeat(var(--hs-cats-cols,4),minmax(0,1fr));
  gap:16px;
}

.hs-cats__tile{
  position:relative;
  display:flex;
  align-items:flex-end;
  min-height:220px;
  padding:22px;
  overflow:hidden;
  border:1px solid var(--hs-w-border,var(--hs-line));
  border-radius:16px;
  color:#fff;
}
/* Photo + scrim behind the label. The scrim is not optional: the tile captions
   are white and several of the category photographs are pale studio shots. */
.hs-cats__tile::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(180deg,transparent,rgba(0,0,0,.82)),
    var(--hs-tile-img,none) center/cover no-repeat;
  transition:transform var(--hs-t-slow);
}
.hs-cats__tile:hover::before{transform:scale(1.06)}
.hs-cats__tile:focus-visible{outline:2px solid var(--hs-accent-2);outline-offset:3px}

.hs-cats__body{position:relative;display:block}
.hs-cats__label{display:block;font-size:13px;font-weight:700}
.hs-cats__title{display:block;font-size:22px;font-weight:800;line-height:1.15;margin-top:2px}

@media(max-width:1000px){
  .hs-cats__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .hs-cats__grid{grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){
  .hs-cats__tile::before{transition:none}
  .hs-cats__tile:hover::before{transform:none}
}