.cat-page{
  padding: 18px 0 26px;
  background:#fff;
}

/* ===========================
   HERO SECTION
=========================== */

.cat-hero{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  padding: 18px 0 12px;
  border-bottom: 1px solid rgba(17,17,17,.08);
  flex-wrap:wrap;
}

.crumbs{
  font-size:12px;
  color:rgba(17,17,17,.65);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.crumbs a{ text-decoration:none; }
.crumbs span{ margin:0 6px; }

.cat-title{
  margin:10px 0 0;
  font-family: var(--serif);
  letter-spacing:.02em;
  font-size: clamp(26px, 3.2vw, 44px);
}

.cat-sub{
  margin-top:8px;
  color:rgba(17,17,17,.65);
  font-size:13px;
}

.cat-controls{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.cat-controls select,
.cat-controls input{
  padding:12px 12px;
  border-radius:16px;
  border:1px solid rgba(17,17,17,.12);
  outline:0;
  font-size:13px;
}

/* ===========================
   FORCE CATEGORY GRID FIX
=========================== */

.cat-page .grid,
#catGrid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  gap:24px !important;
  margin-top:24px;
  width:100%;
}

/* Tablet Large */
@media (max-width:1200px){
  .cat-page .grid,
  #catGrid{
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  }
}

/* Tablet */
@media (max-width:900px){
  .cat-page .grid,
  #catGrid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}

/* Mobile */
@media (max-width:600px){
  .cat-page .grid,
  #catGrid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:16px !important;
  }
}

/* Ultra Small Mobile */
@media (max-width:380px){
  .cat-page .grid,
  #catGrid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}